CSS：外部樣式表/內(nèi)部樣式表/內(nèi)聯(lián)樣式
來源：程序員人生 發(fā)布時間：2014-12-08 08:25:59 閱讀次數(shù)：4611次
在html中，援用CSS樣式有3中方式：外部樣式表，內(nèi)部樣式表，內(nèi)聯(lián)樣式。
本文代碼整理自w3school：http://www.w3school.com.cn
（1）外部樣式表，指在html文件的head標(biāo)簽中，使用link援用另外一個css文件中定義的樣式。如果某個樣式表需要被使用許屢次，使用外部樣式表是最好的選擇。
html文件:
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf⑻" />
<meta http-equiv="Content-Language" content="zh-cn" />
<title>援用外部css樣式</title>
<!--外部樣式表-->
<head>
<link rel="stylesheet" type="text/css" href="css/baseStyle.css">
</head>
<body>
<h1>h1級別的標(biāo)題：紅色</h1>
<h2>h2級別的標(biāo)題：綠色</h2>
<h3>h3級別的標(biāo)題：藍(lán)色</h3>
<p>這是1個段落：灰色</p>
</body>
</html>
CSS樣式，baseStyle.css:
h1 {color:red}
h2 {color:green}
h3 {color:blue}
p {color:gray}
（2）內(nèi)部樣式表，指在html文件的head標(biāo)簽內(nèi)聲明樣式。當(dāng)單個文檔需要特殊的樣式時，就應(yīng)當(dāng)使用內(nèi)部樣式表。
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf⑻" />
<meta http-equiv="Content-Language" content="zh-cn" />
<title>內(nèi)部樣式表</title>
<!--內(nèi)部樣式表-->
<head>
<style type="text/css">
h1 {color:red}
h2 {color:green}
h3 {color:blue}
p{color:gray}
</style>
</head>
<body>
<h1>h1級別的標(biāo)題：紅色</h1>
<h2>h2級別的標(biāo)題：綠色</h2>
<h3>h3級別的標(biāo)題：藍(lán)色</h3>
<p>這是1個段落：灰色</p>
<br/><br/>
</body>
</html>
（3）內(nèi)聯(lián)樣式（1般不建議使用），指在某個html內(nèi)指定改標(biāo)簽內(nèi)容的樣式。由于要將表現(xiàn)和內(nèi)容混雜在1起，內(nèi)聯(lián)樣式會損失掉樣式表的許多優(yōu)勢。
<!--內(nèi)聯(lián)樣式-->
<!--不帶下劃線的鏈接-->
<a href="http://www.baidu.com" style="text-decoration:none" target="_blank">
這是1個不帶下劃線的鏈接
</a>
生活不易，碼農(nóng)辛苦
如果您覺得本網(wǎng)站對您的學(xué)習(xí)有所幫助,可以手機(jī)掃描二維碼進(jìn)行捐贈
