HTML中應(yīng)用CSS的三種方法
你對把CSS應(yīng)用到HTML中去的方法是否了解,這里和大家分享一下,主要有內(nèi)聯(lián),內(nèi)部和外部三種途徑可以把CSS應(yīng)用到Html中去,內(nèi)部樣式服務(wù)于整個當前頁面,外部樣式為整個網(wǎng)站的多個頁面服務(wù),而內(nèi)聯(lián)樣式通過style屬性直接套進HTML中去,相信本文介紹一定會讓你有所收獲。
HTML中應(yīng)用CSS的三種方法
有三條途徑可以把CSS應(yīng)用到HTML中去。
內(nèi)聯(lián)
內(nèi)聯(lián)樣式通過style屬性直接套進HTML中去。
看起來像這樣:
示例代碼
- <pstylepstyle="color:red">text</p>
這將會是指定的段落變成紅色。
我們的建議是,HTML應(yīng)該是獨立的、樣式自由的文檔,所以內(nèi)聯(lián)樣式無論在什么情況下都應(yīng)該盡量避免。
內(nèi)部
內(nèi)部樣式服務(wù)于整個當前頁面。在頭標簽head里面,樣式標簽style里包含當前頁面的所有樣式。
看起來像這樣:
示例代碼
- <!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>
這將使這個頁面的所有段落都是紅色的,所有的連接都是藍色的。內(nèi)聯(lián)樣式類似,你應(yīng)該是HTML文檔和CSS文檔分離開來。#p#
外部
外部樣式為整個網(wǎng)站的多個頁面服務(wù)。這是一個獨立的CSS文檔,簡單的一個范例如下:
示例代碼
- p{color:red;}a{color:blue;}
如果這個文檔存為“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中就可以運用你在css文件中定義的css標簽了。
本文來自CSS在線:http://www.csscss.org/cssarticle/200951582.shtml
【編輯推薦】