在建時(shí)CSS和HTML的使用是必要的,要想在瀏覽器中顯示預(yù)期的CSS樣式表效果,就要讓瀏覽器識(shí)別并正確調(diào)用CSS。而CSS樣式放在不同的地方,所產(chǎn)生的作用范圍也是不同的。在HTML中,主要用四種方法引入CSS:行內(nèi)式、內(nèi)嵌式、導(dǎo)入式和鏈接式。
(1)行內(nèi)式:
<div style="font-size:15px;">行內(nèi)式,直接在當(dāng)前行內(nèi)寫入</div>
即在標(biāo)記的style屬性中設(shè)定CSS樣式,這種方式本質(zhì)上沒體現(xiàn)出CSS的優(yōu)勢(shì),因此不推薦使用。
(2)嵌入式:
<style type="text/css"> body{ margin:0px; padding:0px; background-color:#f6f6f6; } </style>
在對(duì)頁面中各種元素的設(shè)置集中寫在<head>和</head>之間的,對(duì)于單個(gè)頁面來說,這種方式很方便。但是這種方法的使用情況要少的多,最長(zhǎng)見得就是訪問量大的門戶網(wǎng)站。或者訪問量較大的企業(yè)網(wǎng)站的首頁。與第一種方法比起來,優(yōu)點(diǎn)突出,弊端也明顯。優(yōu)點(diǎn):速度快,所有的CSS控制都是針對(duì)本頁面標(biāo)簽的,沒有多余的CSS命令;再者不用外鏈CSS文件。
(3)導(dǎo)入式:
<style type="text/css"> @import "../css/style.css"; </style>
(4)鏈接式:
<link rel="stylesheet" href="/css/style.css" type="text/css" />
導(dǎo)入式和鏈接式差不多,都是從外部引入CSS文件。但是鏈接式對(duì)于客戶端用戶瀏覽網(wǎng)站時(shí),效果會(huì)好些。
鏈接式可以說是現(xiàn)在占統(tǒng)治地位的引入方法。如同IE與瀏覽器。這也是最能體現(xiàn)CSS特點(diǎn)的方法;最能體現(xiàn)DIV+CSS中的內(nèi)容與顯示分離的思想,也最易改版維護(hù),代碼看起來也是最美觀的一種。
總結(jié):對(duì)于一些比較大的網(wǎng)站,為了便于維護(hù),可能會(huì)希望把所有的css樣式分類別放到幾個(gè)CSS文件中,這樣如果使用連接式引入,就需要幾個(gè)語句分別導(dǎo)入CSS文件。如果要調(diào)整CSS文件的分類,就需要同時(shí)調(diào)整HTML文件,這對(duì)于維護(hù)工作來說,是一個(gè)缺陷,如果使用導(dǎo)入式,則可以只引進(jìn)一個(gè)總的CSS文件,在這個(gè)文件中再導(dǎo)入其他獨(dú)立CSS文件;而鏈接式則不具備這個(gè)特性。
免費(fèi)咨詢:18838171308