外連結css檔案的方法:1、使用link標籤連結外部css文件,語句如「 」;2、使用@import規則導入外部css檔。
本教學操作環境:windows7系統、HTML5&&CSS3版本,DELL G3電腦。
推薦:css影片教學
有兩種連接外部CSS檔案的方法
使用link標籤連結外部css檔案
使用@import規則匯入外部css檔案
1、使用link標籤連結外部css檔案(連結式)
當樣式需要被應用到很多頁面的時候,外部樣式表將是理想的選擇。使用外部樣式表,你就可以透過更改一個檔案來改變整個網站的外觀。
連結一個外部樣式表:
<head> <link rel="stylesheet" type="text/css" href="theme.css" /> </head> <link> 标签定义文档与外部资源的关系。 <link> 标签最常见的用途是链接样式表。
注意: link 元素是空元素,它只包含屬性。 link元素只能存在於 head 部分,不過它可出現任何次數。
2、使用@import規則匯入外部css檔案(導入式)
<style> @import 'style.css' //Windows IE4/ NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别 @import "style.css" //Windows IE4/ NS4, Macintosh IE4/NS4不识别 @import url(style.css) //Windows NS4, Macintosh NS4不识别 @import url('style.css') //Windows NS4, Mac OS X IE5, Macintosh IE4/IE5/NS4不识别 @import url("style.css") //Windows NS4, Macintosh NS4不识别 </style>
link和import的區別
link是XHTML標籤,除了載入CSS外,還可以定義RSS等其他事務;而@import屬於CSS範疇,只能載入CSS;
link引用CSS時,在頁面載入時同時載入;而@import需要頁面網頁完全載入以後載入。
link是XHTML標籤,無相容問題;而@import是在CSS2.1提出的,低版本的瀏覽器不支援。
ink支援使用Javascript控制DOM去改變樣式;而@import不支援。
@import可以在CSS檔案中再次引入其他樣式表;而link不支援。
以上是怎樣在外接css文件的詳細內容。更多資訊請關注PHP中文網其他相關文章!