」語句載入;2、使用「@import url("css檔案路徑" );”語句載入。"/> 」語句載入;2、使用「@import url("css檔案路徑" );”語句載入。">

首頁 >web前端 >css教學 >怎麼載入css文件

怎麼載入css文件

青灯夜游
青灯夜游原創
2021-07-22 14:12:393257瀏覽

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

怎麼載入css文件

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

方法1:透過link標籤載入

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

在網頁的93f0f5c25f18dab9d176bd4f6de5d30e9c3bca370b5104690d9ef395f2c5f8d1標籤對中使用2cdf5bf648cf2f33323966d7f58a7f3f標記可呼叫外部CSS檔案。

語法格式:

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

對各個屬性的說明:

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

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

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

說明:

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

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

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

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

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

註:

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

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

(學習影片分享:css影片教學

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

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn