CSS层叠样式表36585.pptVIP

CSS层叠样式表 什么是CSS？ CSS（层叠样式表）：是一种文件排版技术 优点： 用CSS进行排版的网页文件小，传输效率高 减少了网页的编写时间。 能够生成一些HTML所不能产生的特殊效果。 三种使用样式的方法 嵌入一个样式表：使用style/style来标记 内联样式：为HTML的个别元素指定样式 连接到一个外部的样式表：使用LINK标记 link href=…… rel=“stylesheet” type=“text/css” Href想要链接的CSS文件的正确路径 TYPE属性用于指定媒体类型--text/css是一个层叠样式表 REL属性用于定义连接的文件和HTML文档之间的关系。REL=StyleSheet指定一个固定或首选的样式 CSS结构和规则 样式规则组成：选择符 { 属性: 值 } 单一选择符的复合样式声明应该用分号隔开：选择符 { 属性1: 值1; 属性2: 值2 } HEAD TITLECSS例子/TITLE STYLE TYPE=text/css H1 { font-size: x-large; color: red } H2 { font-size: large; color: blue } /STYLE /HEAD CSS结构和规则－－基本语法 选择符 单一个选择符：任何HTML元素都可以是一个CSS的选择符。选择符仅仅是指向特别样式的元素。 ID选择符 类选择符 .style{color:red} P.style{color:red} 组合的选择符 属性：一个属性被指定到选择符是为了使用它的样式。属性的例子包括颜色、边界和字体。 声明的值是一个属性接受的指定。例如，属性颜色能接受值red。 CSS结构和规则－－伪类和伪元素 伪类和伪元素是特殊的类和元素，能自动地被支持CSS的浏览器所识别。 选择符:伪类 { 属性: 值 } A:link { color: red }A:active { color: blue; font-size: 125% } A:visited { color: green; font-size: 85% } A:hover CSS 属性－－字体属性 文字字体：font-family: [字体名称 ] P { font-family: New Century Schoolbook, Times, serif } 字体风格：font-style: 值 normal | italic（斜体 ） | oblique（倾斜 ） 字体加粗：font-weight: 值 normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 CSS 属性－－字体属性 字体大小：font-size: 绝对大小 | 相对大小 | 长度 | 百分比 绝对大小 xx-small | x-small | small | medium | large | x-large | xx-large 相对大小 larger | smaller 长度 百分比 (in relation to parent element) 字体大小属性用作修改字体显示的大小。绝对长度(使用的单位为pt-像素和in-英寸) CSS 属性－－颜色及背景属性 颜色：color: 颜色 H1 { color: blue } H2 { color: #000080 } 背景颜色：background-color: 值 颜色 | transparent (透明) 背景图象：background-image: 值 统一资源定位URLs | none (无) BODY { background-image: url(/images/foo.gif) } 文本属性 文字间隔：word-spacing: 值 normal | 长度 字母间隔：letter-spacing: 值 normal | 长度 文本修饰：text-decoration: 值 underline (下划线)，overline (上划线)，line-through (删除线)，blink (闪烁)，或缺省地使用无。 文本属性 文本转换：text-transform: 值 capitalize (使每个字的第一个字母大写) uppercase (使每个字的所有字母大写) lowercase (使每个字的所有字母小写) none (使用原始值) 文本排列：text-align: 值 left | right | center | justify 文本缩进： text-indent: 值 方框属性都在b