CSS入門(mén)必讀(4)_動(dòng)易Cms教程
鏈入外部樣式表
鏈入外部樣式表是把樣式表保存為一個(gè)樣式表文件,然后在頁(yè)面中用<link>標(biāo)記鏈接到這個(gè)樣式表文件,這個(gè)<link>標(biāo)記必須放到頁(yè)面的<head>區(qū)內(nèi),如下:
<head>
……
<link rel="stylesheet" type="text/css" href="mystyle.css">
……
</head>
上面這個(gè)例子表示瀏覽器從mystyle.css文件中以文檔格式讀出定義的樣式表。rel=”stylesheet”是指在頁(yè)面中使用這個(gè)外部的樣式表。type=”text/css”是指文件的類(lèi)型是樣式表文本。href=”mystyle.css”是文件所在的位置。
一個(gè)外部樣式表文件可以應(yīng)用于多個(gè)頁(yè)面。當(dāng)你改變這個(gè)樣式表文件時(shí),所有頁(yè)面的樣式都隨之而改變。在制作大量相同樣式頁(yè)面的網(wǎng)站時(shí),非常有用,不僅減少了重復(fù)的工作量,而且有利于以后的修改、編輯,瀏覽時(shí)也減少了重復(fù)下載代碼。
樣式表文件可以用任何文本編輯器(例如:記事本)打開(kāi)并編輯,一般樣式表文件擴(kuò)展名為.css。內(nèi)容是定義的樣式表,不包含HTML標(biāo)記,mystyle.css這個(gè)文件的內(nèi)容如下:
hr {color: sienna}
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
(定義水平線的顏色為土黃;段落左邊的空白邊距為20象素;頁(yè)面的背景圖片為images目錄下的back40.gif文件)
內(nèi)部樣式表
內(nèi)部樣式表是把樣式表放到頁(yè)面的<head>區(qū)里,這些定義的樣式就應(yīng)用到頁(yè)面中了,樣式表是用<style>標(biāo)記插入的,從下例中可以看出<style>標(biāo)記的用法:
<head>
……
<style type="text/css">
hr {color: sienna}
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
</style>
……
</head>
注重:有些低版本的瀏覽器不能識(shí)別style標(biāo)記,這意味著低版本的瀏覽器會(huì)忽略style標(biāo)記里的內(nèi)容,并把style標(biāo)記里的內(nèi)容以文本直接顯示到頁(yè)面上。為了避免這樣的情況發(fā)生,我們用加HTML注釋的方式(<!-- 注釋 -->)隱藏內(nèi)容而不讓它顯示:
<head>
……
<style type="text/css">
<!--
hr {color: sienna}
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
-->
</style>
……
</head>
導(dǎo)入外部樣式表
導(dǎo)入外部樣式表是指在內(nèi)部樣式表的<style>里導(dǎo)入一個(gè)外部樣式表,導(dǎo)入時(shí)用@import,看下面這個(gè)實(shí)例:
<head>
……
<style type=”text/css”>
<!--
@import “mystyle.css”
其他樣式表的聲明
-->
</style>
……
</head>
例中@import “mystyle.css”表示導(dǎo)入mystyle.css樣式表,注重使用時(shí)外部樣式表的路徑。方法和鏈入樣式表的方法很相似,但導(dǎo)入外部樣式表輸入方式更有優(yōu)勢(shì)。實(shí)質(zhì)上它相當(dāng)于存在內(nèi)部樣式表中的。
注重:導(dǎo)入外部樣式表必須在樣式表的開(kāi)始部分,在其他內(nèi)部樣式表上面。
內(nèi)嵌樣式
內(nèi)嵌樣式是混合在HTML標(biāo)記里使用的,用這種方法,可以很簡(jiǎn)單的對(duì)某個(gè)元素單獨(dú)定義樣式。內(nèi)嵌樣式的使用是直接將在HTML標(biāo)記里加入style參數(shù)。而style參數(shù)的內(nèi)容就是CSS的屬性和值,如下例:
<p style="color: sienna; margin-left: 20px">
這是一個(gè)段落
</p>
(這個(gè)段落顏色為土黃,左邊距為20象素)
在style參數(shù)后面的引號(hào)里的內(nèi)容相當(dāng)于在樣式表大括號(hào)里的內(nèi)容。
注重:style參數(shù)可以應(yīng)用于任意BODY內(nèi)的元素(包括BODY本事),除了BASEFONT、PARAM和SCRIPT。
多重樣式表的疊加
- MAC錯(cuò)誤的解決方法
- 如何屏蔽動(dòng)易后臺(tái)導(dǎo)航里的某個(gè)功能菜單?
- 動(dòng)易.NET版本留言自動(dòng)選定欄目方法
- 動(dòng)易SiteFactoty整合Discuz!NT3.0
- 在任意位置獲取根節(jié)點(diǎn)ID標(biāo)簽
- 如何開(kāi)啟SiteWeaver6.8的支持,反對(duì)功能
- Windows 2008安裝動(dòng)易.NET系統(tǒng)之四----動(dòng)易系統(tǒng)安裝篇
- Windows 2008安裝動(dòng)易.NET系統(tǒng)之三----數(shù)據(jù)庫(kù)篇
- Windows 2008安裝動(dòng)易.NET系統(tǒng)之二----IIS、目錄環(huán)境配置篇
- 數(shù)據(jù)庫(kù)修復(fù),SQL Server 2005內(nèi)部操作不一致的處理
- 如何安裝動(dòng)易.net程序權(quán)限配置
- 為什么提示對(duì)Windows系統(tǒng)文件夾下的Temp目錄沒(méi)有訪問(wèn)權(quán)限?
動(dòng)易Cms教程教程Rss訂閱Cms教程搜索
動(dòng)易Cms教程推薦
- 動(dòng)易系統(tǒng)添加后臺(tái)模塊插件制作初步
- 如何實(shí)現(xiàn)在首頁(yè)顯示對(duì)文章頻道的統(tǒng)計(jì)
- 動(dòng)易2005、2006版常見(jiàn)錯(cuò)誤號(hào)的原因分析及解決方法
- 2005版模板升級(jí)后,鼠標(biāo)移動(dòng)到rss圖標(biāo)時(shí)提示出錯(cuò)如何解決?
- [轉(zhuǎn)帖]動(dòng)易模板的設(shè)計(jì)思路
- [測(cè)試報(bào)告]動(dòng)易組件注冊(cè)失敗的處理方法(無(wú)需重裝系統(tǒng))
- 如何解決部分1.2的標(biāo)簽在2.0模板解析引擎中導(dǎo)致整個(gè)頁(yè)面異常的問(wèn)
- 解決登錄時(shí),按回車(chē)后跳到了搜索頁(yè)面的問(wèn)題
- 添加文章如何將默認(rèn)的"不分頁(yè)"改為"自動(dòng)分頁(yè)"?
- 為什么設(shè)置了標(biāo)簽中顯示文章數(shù)的參數(shù)大于20后就只顯示20篇?
- 相關(guān)鏈接:
- 教程說(shuō)明:
動(dòng)易Cms教程-CSS入門(mén)必讀(4)
。