CSS的調(diào)用,按照CSS出現(xiàn)在頁面的不同位置,可以分為3種方法:
創(chuàng)新互聯(lián)公司長期為千余家客戶提供的網(wǎng)站建設(shè)服務(wù),團隊從業(yè)經(jīng)驗10年,關(guān)注不同地域、不同群體,并針對不同對象提供差異化的產(chǎn)品和服務(wù);打造開放共贏平臺,與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為達坂城企業(yè)提供專業(yè)的成都網(wǎng)站制作、成都做網(wǎng)站,達坂城網(wǎng)站改版等技術(shù)服務(wù)。擁有十余年豐富建站經(jīng)驗和眾多成功案例,為您定制開發(fā)。
元素中直接使用;
從頁面頭部調(diào)用;
采用鏈接的形式調(diào)用。
不同的調(diào)用方法有不同的寫法和優(yōu)先級。下面分別做一下介紹。
一、元素中直接使用
這種調(diào)用方式的寫法如下:
元素名稱 style="屬性:屬性值;"/元素名稱
在樣式中直接使用CSS,語法是使用style標簽,在雙引號中,樣式的語法結(jié)構(gòu)和獨立樣式表中完全相同。例如:
div style="width:240px;height:80px;background-color:#cccccc;text-align:center;font-size:14px"
示例:元素中直接調(diào)用。/div
該樣式中定義了元素寬、高為360、80像素,背景色為灰色,字體大小為14像素。其應(yīng)用到頁面中的顯示如圖1。
二、從頁面頭部調(diào)用
從頁面頭部調(diào)用CSS是將CSS寫在頁面的head元素中,然后在頁面中調(diào)用。其語法結(jié)構(gòu)如下:
style
選擇符{屬性:屬性值;}
/style
頁面上的所有樣式都可以寫在style和/style中。使用這種方式調(diào)用CSS,在頁面中必須有相應(yīng)的調(diào)用代碼。
其中,類選擇符的調(diào)用代碼如下:
元素名稱 class="類選擇符名稱"/元素名稱
ID選擇符的調(diào)用代碼如下:
元素名稱 id="id 類選擇符名稱"/元素名稱
下面我們來用一個示例演示一下。
head
titleCSS調(diào)用方法/title
style
.content{
background-color: #cccccc;
font-size: 14px;
width: 240px;
height: 80px;
color: Blue;
text-align: center;
}
/style
/head
body
div class="content"示例:從頁面頭部調(diào)用。/div
/body
該樣式應(yīng)用到頁面的效果如圖2所示。
三、采用鏈接的形式調(diào)用
采用鏈接的形式調(diào)用CSS通常有兩種方法:
使用link元素
使用link元素調(diào)用CSS的語法如下:
link rel="stylesheet" href="css文件路徑" type="text/css"/
其中rel="stylesheet"指這個link和其href之間的關(guān)聯(lián)樣式為樣式表文件。type="text/css"指文件類型是樣式表文本。
使用@import
使用@import調(diào)用和使用link元素調(diào)用的區(qū)別在于,使用@import的調(diào)用方法只能使用在樣式文件中,即只能在調(diào)用的樣式文件,或style元素中才能正常使用
css樣式將對布局、字體、顏色、背景和其它文圖效果實現(xiàn)更加精確的控制。只通過修改一個文件就改變頁數(shù)不計的網(wǎng)頁的外觀和格式。 在所有瀏覽器和平臺之間的兼容性。更少的編碼、更少的頁數(shù)和更快的下載速度。除了還不能全面支持我們常用的大多數(shù)瀏覽器之外,CSS在實現(xiàn)其它承諾方面作得相當出色。CSS在改變我們制作樣式表的方法。它為大部分的網(wǎng)頁創(chuàng)新奠定了基石。
1、使用Dreamweaver等工具來新建
2、新建一個空白的記事本,后綴名修改為.css
3、引入,使用link/標簽來應(yīng)用你的CSS,具體用法如下
link rel="stylesheet" type="text/css" href="你的CSS文件路徑"/