的基础语法格式.docVIP

CSS（Cascading Styel Sheet）是控制 Web 页面外观的一系列格式设置规则,是网页设计必不可少的工具之一。下面我们就开始学习css的基本语法格式。 　　一 CSS定义规则 　　层叠样式表是一个完全的纯文本文件，通常以“css”为扩展名作为单独的文件来使用，它的内容包含了一组告诉浏览器，如何安排与显示特定的html标签中内容的规则，CSS定义规则由三个部分构成：选择符，属性和属性的取值。语法如下： 语法： selector { property: value } 选择符 { 属性： 值 } 　　说明： 　　1 选择符 　　选择符是要定义样式的html标记，将html标记作为选择符定义后，则在html页面中该标记下的内容，会按照CSS定义的规则发生改变。 　　2 属性 　　CSS属性指的是在选择符中要改变的内容，常见的有：字体属性，颜色属性，文本属性等。下面就是我们定义的一个样式表。 @charsetgb2312; body { font-family: 宋体; font-size: 20px; color: #FF0000; } p { font-family: 宋体; font-size: 30px; color: #FF00ff; } 　　在这个样式表中： 　　1 @charsetgb2312;表示使用中文国标字符集。 　　2 body 和 p 是 html 中的两个标签，对这两个标签设置了三种样式，即： 　　font-family: 指定字体的字型。 　　font-size: 指定字体的大小。 　　color: 指定字体的颜色。 上面我们定义了一个样式表，下一步的任务是如何把这个样式表和html文件相关联，使html文件按照我们定义的样式显示出来，与html文件相关联的方法有四种，下面我们分别叙述。 　　二 嵌入样式表 　　在Html页面内部定义的CSS样式表,叫做嵌入式CSS 样式表，也就是在HTML文档的head部分中，使用 style 标签并在该标签中定义一系列 CSS 规则。 语法：head style type=text/css !-- ...... -- /style /head 　　说明： 　　style指示CSS样式表开始，结束标志为 /style，在开始标志 style中可以根据需要添加一些属性，如上列中的属性type=text/css，它表示CSS样式表采用MIME类型，这种类型的特点是，当浏览器不支持CSS代码时，对CSS代码进行过滤，避免浏览器以源代码的方式显示CSS代码。为了保证更加可靠，在样式表里再次加上注释标识符 !--......--，CSS规则就定义在这个注释标识符中。 　　示例1 t1.htm htmlheadmeta http-equiv=Content-Type content=text/html; charset= gb2312 /title嵌入式CSS样式表/titlestyle type=text/css!-- @charsetgb2312; body { font-family: 宋体; font-size: 20px; color: #FF0000; } p { font-family: 宋体; font-size: 30px; color: #FF00ff; } --/style/headbody千山鸟飞绝万径人踪灭p千山鸟飞绝万径人踪灭/p/body/html 三 链接外部样式表 　　外部CSS样式表是一个以 .css为后缀的外部文件,定义一个外部样式表可以应用于多个页面。在html页面中使用link标签，可以将外部的css样式表连接进来，其语法如下： 　　语法： link rel=stylesheet href=*.css” type=text/css 　　参数: 　　1 rel属性表示样式表将以何种方式与HTML文档结合。rel取值:Stylesheet,表示指定一个外部的样式表 　　2 *.css是单独保存的样式表文件。 　　示例2 定义一个外部css文件p2.css,然后在t2.htm文件中连接该文件。 　　t2.htm htmlheadmeta http-equiv=Content-Type content=text/html; charset=gb2312 /title链接外部样式表/titlestyle type=text/css!--@charsetgb2312; body { font-family: 宋体; font-size: 20px; color: #FF0000; } p { font-family: 宋