詳解CSS文件中的4種引入方式:行內(nèi),內(nèi)聯(lián)式,外部式,導(dǎo)入式
我要評(píng)論CSS引入方式-行內(nèi)式
通過 style這個(gè)標(biāo)簽屬性,將css鍵值對(duì)直接寫入標(biāo)簽內(nèi)
<p style="width: 100px;height: 100px;background: red;"></p> <!--注釋:這段代碼描述的是一個(gè)寬高為100px，背景為紅色的容器-->
css引入方式-內(nèi)嵌式（嵌入式）
使用style標(biāo)簽將css屬性名和屬性值引入到html頁面中,通常style標(biāo)簽放置在head標(biāo)簽中。為什么css樣式要放置在head標(biāo)簽中呢,因?yàn)榇a從上到下執(zhí)行,如果先加載結(jié)構(gòu),那么用戶看到的就將是干巴巴的內(nèi)容,而沒有通過美化,而先加載樣式后加載結(jié)構(gòu),就相當(dāng)于孩子出生就是穿著衣服的！
<head>
<style type="text/css">
p{
width: 100px;height: 100px;background: red;
}
</style>
</head>
以上代碼描述的也是一個(gè)寬高為100px，背景為紅色的容器，只不過是通過內(nèi)嵌式引入的!
css引入方式之外鏈?zhǔn)?/strong>
通過link標(biāo)簽將獨(dú)立的css文件引入到html頁面中
<link rel="stylesheet" type="text/css" href="./style.css">
rel="stylesheet"描述了當(dāng)前頁面與href所指定的文檔的關(guān)系，即說明的是href鏈接的文檔是一個(gè)新式表,type="text/css"是指定MINME類型,也就是css文檔。href="./style.css"規(guī)定被鏈接文檔的位置
css引入方式之導(dǎo)入式
<style type="text/css">
@import url("style.css");
</style>
通過@import url引入一個(gè)獨(dú)立的CSS文件,url("style.css")規(guī)定被鏈接文檔的位置
到此這篇關(guān)于CSS文件中的4種引入方式:行內(nèi),內(nèi)聯(lián)式,外部式,導(dǎo)入式的文章就介紹到這了,更多相關(guān)css 引入方式內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要介紹了css樣式引入及優(yōu)缺點(diǎn)，本文給大家分享三種css的引入方式，通過代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友參考下2020-04-02
關(guān)于CSS引入方式的詳細(xì)見解小結(jié)
這篇文章主要介紹了關(guān)于CSS引入方式的詳細(xì)見解小結(jié)的相關(guān)資料，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-02-25
這篇文章主要介紹了詳解CSS文件的三種引入方式的相關(guān)資料，CSS的引入方式共有三種：行內(nèi)樣式、內(nèi)部樣式表、外部樣式表。具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-09-27- CSS四種引入方式:標(biāo)簽內(nèi)的CSS 、網(wǎng)頁內(nèi)的CSS、link引用的CSS、import引用的CSS，下面用一個(gè)例子演示用法2013-12-06
- 在本文將為大家介紹下css的引入方式、css的基本語法等等，新手朋友們可以參考下哈，希望對(duì)大家有所幫助2013-09-12
