專注于深圳網站制作網站設計，專業的深圳建站公司供應商！
咨詢電話 :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>
