CSS(Cascading Style Sheet)可译为 "层叠样式表" 或 "级联样式表", 它定义如何显示 html 元素, 用于控制 web 页面的外观. 通过使用 CSS 实现页面的内容与表现形式分离, 极大提高了工作效率 . 样式存储在样式表中, 通常放在 < head > 部分或存储在 外部 CSS 文件中. 作为网页标准化设计的趋势, CSS 取得了浏览器厂商的广泛支持, 正越来越多的被应用到网页设计中去.
网页现在的新标准是 W3C. 目前的模式是 HTML+CSS+JavaScript, 如何理解呢, 就是 HTML 是网页的结构, CSS 是网页的样式, JavaScript 是行为. 结构就是盖房子先要把结构建出来, 然后用 CSS 来装饰. 其实你在用 dreamweaver 做网页时就已经用到了 CSS, 比如你用 DW 的属性面板来设置一个字的字体, 颜色和大小, 当你选好后, 就会自动生成一个. style1 的红色代码, 在 < style></style > 之间不知道你注意过没有, 这就是 CSS.
如何使用 CSS?CSS 是在 HTML 4 开始使用的, 是为了更好的渲染 HTML 元素而引入的. CSS 可以通过以下方式添加到 HTML 中:
内联样式 - 在 HTML 元素中使用 "style" 属性
内部样式表 - 在 HTML 文档头部 <head> 区域使用 < style> 元素 来包含 CSS
外部引用 - 使用外部 CSS 文件
什么是内联样式? 当特殊的样式需要应用到个别元素时, 就可以使用内联样式. 使用内联样式的方法是在相关的标签中使用样式属性. 样式属性可以包含任何 CSS 属性. 以下实例显示出如何改变段落的颜色和左外边距.
1 <p style="color:#fff;margin-left:20px;background-color:yellow;">This is a paragraph.</p>
注释: 早期背景色属性 (background-color) 是使用 bgcolor 属性定义.
什么是内部样式表? 当单个文件需要特别样式时, 就可以使用内部样式表. 你可以在 < head> 部分通过 <style > 标签定义内部样式表:
- <head>
- <style type="text/css">
- body {background-color:yellow;}
- p {color:blue;}
- </style>
- </head>
专门建立的学习 Q-q-u-n: 784783012 , 分享学习的方法和需要注意的小细节, 不停更新最新的教程和学习技巧
(从零基础开始到前端项目实战教程, 学习工具, 全栈开发学习路线以及规划)
什么是外部样式表? 当样式需要被应用到很多页面的时候, 外部样式表将是理想的选择. 使用外部样式表, 你就可以通过更改一个文件来改变整个站点的外观.
- <head>
- <link rel="stylesheet" type="text/css" href="mystyle.css">
- </head>
来源: http://www.jianshu.com/p/6b2fdb8a73c6