學(xué)會怎樣給html標(biāo)簽定義css樣式

H5edu教育html5開發(fā)為您解答：

創(chuàng)新互聯(lián)成立于2013年，先為郎溪等服務(wù)建站，郎溪等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢服務(wù)。為郎溪企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問題。

在HTML中常用以下3種方式定義CSS：Embedding（嵌入式）、Linking（引用式）、Inline（內(nèi)聯(lián)式）

一、嵌入式：使用HTML的style元素，在文檔中定義CSS樣式

head

style type="text/css"

h1{color:red}

p{color:blue}

/style

head

二、內(nèi)聯(lián)式 ：每一個HTML元素都包含一個style屬性，可以直接定義樣式。該樣式僅能用于該元素的內(nèi)容，對于另一個同名的元素則不起作用。

p style="color:#FFF;font-weight:bold;"內(nèi)聯(lián)樣式/p

三、外部引用式：外部引用指HTML文檔本身不含有CSS樣式，而是動態(tài)引用外部的CSS文件定義文檔的表現(xiàn)形式。

1、使用樣式表的處理指令語句-在HTML文檔的開頭部分寫一個關(guān)于樣式表的指令處理語句

?xml-stylesheet type="text/css" href="mystyle.css" ?

html

指令語句

/html

不過只有使用xml語法格式編寫的html文檔才支持使用該指令，大多數(shù)瀏覽器僅當(dāng)被保存為xhtml或xml格式才有效，且JS不能處理這種CSS，所以不建議使用。

2、使用@import命令 -在style元素之間使用@import命令導(dǎo)入外部的css文件

head

style type="text/css"

!--下面兩行代碼效果一樣

@import "mystyle.css";

@import url("mystyle.css");

--

/style

/head

任何@import規(guī)則必須出現(xiàn)在所有規(guī)則之前。參數(shù)是一個css文件的URL地址。在一個css文件中也可以用@import指令將另一個css文件導(dǎo)入。

3、使用link元素

head

link rel="stylesheet" href="css的url" type="text/css"

/head

這也是最常用的方式。

4、使用HTTP消息報頭鏈接到樣式表 -可以使用HTTP消息報頭的link字段鏈接一個外部樣式表。 link:mystyle.css;rel=stylesheet;

//等同于link rel="stylesheet" href="css的url" type="text/css"

HTTP報頭中可以使用多個link，從而鏈接多個樣式表，且HTTP報頭中的link比HTML文檔中的link（head元素中）具有優(yōu)先級。

怎么定義css？

定義css分三類：

第一類：標(biāo)簽元素

body,ul,li等，直接定義 ，格式：標(biāo)簽名{屬性：樣式}

body{font-size:12px;}

第二類：類定義 在前面都是要加點

.top{margin-top:20px;}

第三類：id定義，id定義是樣式里做高的，一般不建議用。id定義用#

#footer{ margin-top:20px;}

怎樣設(shè)定自定義CSS

自定義CSS的三中方方式：

一、行間樣式表

行間樣式表是指將CSS樣式編碼寫在HTML標(biāo)簽中，格式如下

h1?style="font-size:12px;color:#000FFF"

我的CSS樣式。

/h1

行間樣式表由HTML元素的HTML元素的style支持，只需將CSS代碼用分號隔開寫在style=""之中。這是最基本的形式，但是它沒有實現(xiàn)表現(xiàn)與內(nèi)容分離且不能靈活的控制多個頁面所以我們只是在調(diào)試CSS代碼的時候使用。

二、內(nèi)部樣式表

內(nèi)部樣式表與行間樣式表相似都是把CSS代碼寫在HTML頁面中，稍微不同的是前者可以將樣式表放在一個固定的位置，格式如下

html

head

title內(nèi)部樣式表/title

style?type="text/css"

h1{font-size:12px;

color:#000FFF

}

/style

/head

body

h1我的CSS樣式。/h1

/body

/html

內(nèi)部樣式表編碼是初級的應(yīng)用形式，不能達(dá)到跨頁面使用所以不適合使用。

三、外部樣式表

外部樣式表是CSS應(yīng)用中最好的一中形式，它將CSS樣式代碼單獨放在一個外部文件中，再由網(wǎng)頁進(jìn)行調(diào)用。多個網(wǎng)頁可以調(diào)用一個樣式文件表，這樣能夠?qū)崿F(xiàn)代碼的最大限度的重用及網(wǎng)站文件的最優(yōu)化配置，格式如下

html

head

title外部樣式表/title

link?rel="stylesheet"?rev="stylesheet"?href="style.css"

/head

body

h1我的CSS樣式。/h1

/body

/html

在style.css中的代碼為

h1{font-size:12px;

color:#000FFF

}

我們在head中使用了link標(biāo)簽來調(diào)用外部樣式表文件。將link指定為stylesheet方式，并使用了href="style.css"指明樣式表文件的路徑便可將該頁面應(yīng)用到在style.css中定義的樣式。

分享文章：定義css樣式,怎么定義css樣式
網(wǎng)頁地址：http://m.rwnh.cn/article42/phjhhc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供做網(wǎng)站、定制網(wǎng)站、網(wǎng)站改版、響應(yīng)式網(wǎng)站、Google、App開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)