专注于深圳网站制作网站设计，专业的深圳建站公司供应商！
咨询电话 :0755-82968506
微信：ebxservice
网站建设CSS文件内定义CSS
网站建设将各种CSS编辑在一个特定的文件里，只耍按照1.6.1节格式一、二、二进行CSS定义即吋，文件内不作任何HTML标签。保存文件时，文件客也耍用半角ASCII字符，扩展名规定为.css。这杆保存的文件就是CSS文件《 CSS文件内容的一般形式如下:
标签名1 [屈性1:值1;屈性2:值2; . }
标签名2 (屈性1:值1;庙性2:值2; . }
......
•类名1(屈性1:值1;庙性2:值2;……}
•类名2 (屈性1:值1;庙性2:值2;……}
#ID名1{.网性1:值1;屈性2:值2;
学ID名2{.网性1:值1;屈性2:值2;
实际编辑时，为便丁阅读，叶将每个M性单独写成一行。
例如，有一个typel.css文件的内容如下。
p{ /*定义标签P的样式*/
font-family: ’黑体"；
font-size:16px;
color:rgb(255,0,0);
text-align:center;)
* fontclassl( /*定义一个名为fontclassl的类样式*/
font-family:"谐体"；
font-size:12px;
color:rgb{0,0,255);
text-align:center? }
#fontidl{ /*定义一个名为fontidl的ID样式*/
font-family:"宋体"；
font-size:13px;
color:rgb{0,255,0); }
1.6.2在网页里应用CSS
标签样式定义好以后，在网页中应用该标签时，标签样式会『丨动控制元岽的显示样式，如1.6.1节介绍的p标签样式和h卜h4标签#式的定义与应用《类#式定义好以后，该样式时应用丁•一类(多个}标签元裹中，釆用名为“class”的柄性来引用类柞式，应用格式如下：
<标签名class: ”类名">……"标签名>
ID样式定义好以后，该样式只能应用丁•某一个标签元裹内，采用客为“id”的届性来引用ID样式，应用格式如下：
<标签名id= "ID名">……
书写各种名、届性和域性值时，耍注意釆ffl半角字符(屈性值为汉字宁体名称例外)，并区分大小写。虽然HTML规范对CSS不区别大小写，但XHTML规范却是严格区别CSS的大小写。我们应按照XHTML规范执行。
在网页中应用CSS时，常常耍用到div和span这两种HTML标签。标签div用丁定义块(或层)元素，span用定义行内元态-这两个标签都nj•应用样式类和id柞式，以确定相应元态的显示禅式。
span与div的不同之处在： span是内联的，用于一小块内联HTML中，可嵌套于多种标签(如div、p、table等)之内，如果不给span冗态指定样式，则它什么也不做：而div是块级的标签，用于组合一大块代码，div元裹内可眹套div元素、span元素和其他HTML元素，它的前后有断行。
如例1-10.htm在网页.头部
#签内，按如下方式定义并应用类#式和ID样式。
------------------淸笮 1-10 l-10.htm-----------
注意：当网页中出现元素嵌套时，一般情况下，内屋元素会继承外屋元素的样式，但内展元索设有独立样式时，按独立设定的样式显示.当多种样式作用于一个网页对象时，最里展的样式决定这个对象的显示形式，这是样式表的层金特性，
1.6.3 CSS 文件
1.CSS文件的建立
网页以将一系列CSS定义集中起来，不包栝任何HTML标签，争独保存为一个文件，文件扩展名为.css-然沿采用链接或导入的方式，能够使这个CSS文件被网站内所有网页文件所共享。
2. CSS文件的应用
其在HTML网页的head头部元岽中，将匕经建立CSS文件链接或导入进来，则CSS文件里所有定义的CSS，就能够被网页元裹直接使
1)链接CSS文件与样式应用
链接CSS文件盅耍在网页head头部进•设CSS文件所在的路径和文件名是path/filename.css,则在HTML网UT.头部链接CSS文件的格式如下：
<head>
<link hre£="path/£ilenajne.css" rel="stylesheet" type= "text/css" />
</head>
若在网页里链接了 CSS文件，则网页body ±体内备种标签元裹就nj•以很方便地应用CSS文件里已定义的各种样式，使用方式与1.6.2节所讲的方式一柞。当用户浏览网页时，元裹中有应fflCSS的地方，就会1H动地到CSS文件里i•査找相应的样式，并发送给用户浏览器，控制对应元裹的显示样式《
若有一个网页文件1-11.htm(与typel.css在同一口录下)，其内容如下》
------------------清单 1-12 l-ll.htm------------
<html>
<head>
<link hre£="typel.css" rel="tylesheet" type="text/css" />
</head>
<body>
<div class="textl"
<p id="titlel”>静夜思</p>
<p>床前明月光光，疑是地上霜。</p>
不头望明月，低头思故乡。
</div>
<P>
<table><capital id=“wtitlel”>课程表</capital>
<tr><th>第12书</以><化>第 34 节</th><th>^ S6 甘</th></tr>
<tr><td> 语文 </td><td> 数学 </td><td> 英语 </td></tr>
</table>
</p>
</body>
<html>
