HTML中應(yīng)用CSS的三種方法
你對把CSS應(yīng)用到HTML中去的方法是否了解，這里和大家分享一下，主要有內(nèi)聯(lián)，內(nèi)部和外部三種途徑可以把CSS應(yīng)用到Html中去，內(nèi)部樣式服務(wù)于整個(gè)當(dāng)前頁面，外部樣式為整個(gè)網(wǎng)站的多個(gè)頁面服務(wù)，而內(nèi)聯(lián)樣式通過style屬性直接套進(jìn)HTML中去，相信本文介紹一定會(huì)讓你有所收獲。
HTML中應(yīng)用CSS的三種方法
有三條途徑可以把CSS應(yīng)用到HTML中去。
內(nèi)聯(lián)
內(nèi)聯(lián)樣式通過style屬性直接套進(jìn)HTML中去。
看起來像這樣：
示例代碼
- <pstylepstyle="color:red">text</p>
這將會(huì)是指定的段落變成紅色。
我們的建議是，HTML應(yīng)該是獨(dú)立的、樣式自由的文檔，所以內(nèi)聯(lián)樣式無論在什么情況下都應(yīng)該盡量避免。
內(nèi)部
內(nèi)部樣式服務(wù)于整個(gè)當(dāng)前頁面。在頭標(biāo)簽head里面，樣式標(biāo)簽style里包含當(dāng)前頁面的所有樣式。
看起來像這樣：
示例代碼
- <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html>
- <head>
- <title>CSSExample</title>
- <styletypestyletype="text/css">p{color:red;}a{color:blue;}</style>
- </head>
- <body>
- </body>
- </head>
- </html>
這將使這個(gè)頁面的所有段落都是紅色的，所有的連接都是藍(lán)色的。內(nèi)聯(lián)樣式類似，你應(yīng)該是HTML文檔和CSS文檔分離開來。#p#
外部
外部樣式為整個(gè)網(wǎng)站的多個(gè)頁面服務(wù)。這是一個(gè)獨(dú)立的CSS文檔，簡單的一個(gè)范例如下：
示例代碼
- p{color:red;}a{color:blue;}
如果這個(gè)文檔存為“web.css”的話，它可以這樣跟HTML文檔連接起來：
示例代碼
- <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Strict//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html>
- <head>
- <title>CSSExample</title>
- <linkrellinkrel="stylesheet"type="text/css"href="web.css"/>
- </head>
- <body>
- </body>
- </head>
- </html>
保存HTML文檔，現(xiàn)在已經(jīng)把HTML和CSS連接起來了，在你的html中就可以運(yùn)用你在css文件中定義的css標(biāo)簽了。
本文來自CSS在線：http://www.csscss.org/cssarticle/200951582.shtml
【編輯推薦】
