分别写出引入CSS的3种方式, 特点, 优先级
第一：css的三種引入方式
1.行內(nèi)樣式
最直接最簡單的一種，直接對HTML標簽使用style=""，例如：
<p style="color:#F00; "></p>
缺點：HTML頁面不純凈，文件體積大，不利于蜘蛛爬行，后期維護不方便。
2.內(nèi)嵌樣式
內(nèi)嵌樣式就是將CSS代碼寫在<head></head>之間，并且用<style></style>進行聲明，例如：
<style type="text/css">
body,div,a,img,p{margin:0; padding:0;}
</style>
優(yōu)缺點：頁面使用公共CSS代碼，也是每個頁面都要定義的，如果一個網(wǎng)站有很多頁面，每個文件都會變大，后期維護難度也大，如果文件很少，CSS代碼也不多，這種樣式還是很不錯的。
3.外部樣式
????31.鏈接樣式（推薦）
????鏈接樣式是使用頻率最高，最實用的樣式，只需要在<head></head>之間加上<link…/>就可以了，如下：
????<link type="text/css" rel="stylesheet" href="style.css" />
????優(yōu)缺點：實現(xiàn)了頁面框架代碼與表現(xiàn)CSS代碼的完全分離，使得前期制作和后期維護都十分方便
????3.2.導(dǎo)入樣式（不建議使用）
????導(dǎo)入樣式和鏈接樣式比較相似，采用@import樣式導(dǎo)入CSS樣式表，在HTML初始化時，會被導(dǎo)入到HTML或者CSS文件中，????成為文件的一部分，類似第二種內(nèi)嵌樣式。
????@import在html中使用，如下：
????<style type="text/css">
????@import url(style.css);
????</style>
????@import在CSS中使用，如下：
????@import url(style.css);
??
????鏈接式和導(dǎo)入式的區(qū)別：
????<link>
????????1、屬于XHTML
????????2、優(yōu)先加載CSS文件到頁面
????@import
????????1、屬于CSS2.1
????????2、先加載HTML結(jié)構(gòu)在加載CSS文件。
第二：四種CSS引入方式的優(yōu)先級
1.就近原則
2.理論上：行內(nèi)>內(nèi)嵌>鏈接>導(dǎo)入
3.實際上：內(nèi)嵌、鏈接、導(dǎo)入在同一個文件頭部，誰離相應(yīng)的代碼近，誰的優(yōu)先級高（頁面多種方式使用css樣式引入）
綜合代碼如下：
<!DOCTYPE> <html><head><meta charset="utf-8" /><title>行內(nèi)樣式/內(nèi)嵌樣式和外部樣式的優(yōu)先級</title><!--外部樣式表--><link rel="stylesheet" type="text/css" href="css/style.css" /><!--內(nèi)嵌樣式表--><style type="text/css">p{color: blue;}</style><!--外部樣式表--><!--<link rel="stylesheet" type="text/css" href="css/style.css" />--></head><body><p>我是p段落（注意：內(nèi)嵌樣式和外部引入樣式 離我最近的那種樣式方式給我?guī)淼挠绊?#xff09;</p><div >我是div，我什么樣式都沒有</div><!--行內(nèi)樣式--><div style="color: hotpink;">我是行內(nèi)樣式</div><ol><li>歡迎進入博客一起學習</li><li>https://blog.csdn.net/muzidigbig</li></ol></body> </html>?
總結(jié)
以上是生活随笔為你收集整理的分别写出引入CSS的3种方式, 特点, 优先级的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： unable to resolve de
- 下一篇： css的属性是变量是怎么表达,CSS自定