」;2、在stylet標籤中,使用「@import」規則引入,語法「@import url( css檔案地址)」。"> html如何引入css文件-前端問答-PHP中文網

html如何引入css文件

青灯夜游
發布: 2021-05-19 11:25:41
原創
10561 人瀏覽過

引入方法:1.使用link標籤引入,語法「」;2、在stylet標籤中,使用「@import」規則引入,語法「@import url(css檔案位址)」。

html如何引入css文件

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

html引入css檔案有兩種方法:

  • #使用link標籤引用外部CSS檔案(連結方式)

  • #使用@import引用外部CSS檔案(導入方式)

#1、使用link標籤

在HTML頭部的

標籤中使用標籤引入外部的CSS 檔案

html如何引入css文件

##2、使用@import規則

在HTML 頭部的 標籤的 標籤中,使用CSS @import規則引入外部CSS 檔案

html如何引入css文件

比較連結方式和導入方式

連結方式(下面用link 代替)和導入方式(下面用@import 代替)都是引入外部的CSS 文件的方式,下面我們來比較這兩種方式。

link 屬於HTML,透過標籤中的href 屬性來引入外部文件,而@import 屬於CSS,所以導入語句應寫在CSS 中,要注意的是導入語句應寫在樣式表的開頭,否則無法正確匯入外部檔案;

@import 是CSS2.1 才出現的概念,所以如果瀏覽器版本較低,無法正確匯入外部樣式檔案;

當HTML 檔案載入時,link 引用的檔案會同時被加載,而@import 引用的檔案則會等頁面全部下載完畢再載入;

(學習影片分享:

css影片教學

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

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!