cascading style sheet:层叠样式表。用途:定义web页面的风格和样式,布局和外观,使设计人员在更多方面控制web页面。提供了从内容中分离应用样式和设计的机制。但不同browser支持不同CSS级别,所以也是构建跨browser应用的一大障碍。
一、基础
样式表由样式规则组成,Browser根据规则来展示文档。样式表规则由两部分组成:选择符和样式定义。
形式:选择符{
属性1:值1;
属性2:值2;。。。
}
选择符可以是任何HTML标记。注释/**/。
分组的定义形式:多个HTML元素使用同一样式,可以缩短样式表规模,减少页面大小,提高网页下载速度。eg. h1,h2,h3{color:blue}。也可以对同一元素分组eg.h1{ color:blue; font-size:12pt;}。
继承:元素可以继承父集的样式。子元素引入新的样式规则将覆盖父层的样式规则。
1.内部样式表:在html页面中,在<html>和<body>标记之间用<style>表示样式表。属性type=“text/css”指定样式表定义使用的语言,浏览器加载页面时,若不能识别该语言,则忽略该样式表=》跨浏览器。
2.外部样式表:
1)链接到样式表:可将多个html文件链接到一个中心样式表文件,<link rel="stylesheet" href="../path/name.css" type="text/css">
2)输入样式表:@import url("name.css"); html文档中定义的其他样式表规则将覆盖输入样式表中作用在相同对象上的规则。
3.样式类:对某类型的标记设置几种不同风格的css属性。
创建样式类:标记.样式类名{属性1:属性值1;属性2:属性值2;。。。}
样式类名{属性1:属性值1;属性2:属性值2;。。。} 任何类型的标记都可使用
使用样式类:<标记 class=“样式类名”>
4.常用的样式表属性
1)字体属性:字体font、字体簇font-family、font-size、font-style、font-variant、字体加粗font-weight
2)颜色&背景属性:color、background-attachment、background-color、background-image、background-position、background-repeat
3)文字属性:letter-spacing、word-spacing、text-decoration、vertical-align、text-align、文本转换text-transform、text-indent文本缩进、line-height
4)滤镜属性:filter:filtername(parameters)