怎麼載入css文件

載入css檔案的方法：1、使用「」語句載入；2、使用「@ import url("css檔案路徑");」語句載入。

本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

方法1：透過link標籤載入

標籤定義文件與外部資源的關係，標籤最常見的用途是連結樣式表。

在網頁的

標籤對中使用標記可呼叫外部CSS檔案。

語法格式：

<link rel="stylesheet" type="text/css" href="css文件路径" />

對各個屬性的說明：

• #href 屬性設定外部樣式表檔案的位址，可以是相對位址，也可以是絕對地址。

• rel 屬性定義關聯的文檔，這裡表示關聯的是樣式表。

• type 屬性定義匯入檔案的類型，同 style 元素一樣，text/css表示為 CSS 文字檔案。

說明：

這種方法會以網頁文件主體裝載前裝載CSS文件，因此顯示出來的網頁從一開始就是帶樣式的效果的，它不會像導入式那樣先顯示無樣式的網頁，然後再顯示有樣式的網頁。

方法2：透過@import方式載入

@import規則，用於從其他樣式表匯入樣式規則，這些規則必須先於所有其他類型的規則。

使用@import指令用以把外部樣式表資訊導入頁面中，它是存在於在標籤中的。

<style type="text/css">
@import url("css文件路径");
</style>

註：

使用@import引入CSS可以很方便的引入外部文件的CSS程式碼，方便維護與規劃。但每多引進一個CSS文件，就會對伺服器增加一次連線請求，當存取量較大時，需在維護性和效能上進行權衡。

使用@import方式載入會導致HTML頁面載入完成之後才會去載入CSS文件，也就是說在載入CS​​S文件之前，頁面是裸奔的，但是進入網站回應速度會更加快！

（學習影片分享：css影片教學）

以上是怎麼載入css文件的詳細內容。更多資訊請關注PHP中文網其他相關文章！