為什么要用css設置樣式？CSS和傳統HTML排版比較

CSS樣式表是HTML中設計中最常用利用最普遍的一個手藝了。他的英文全名為Cascading style sheets，翻譯過來就是串接式排版樣式。它的降生是為了填補傳統HTML排版中的不足的。

東西/原料

html根本常識
css根本常識
ue編纂器

HTML排版的錯誤謬誤

1
設置麻煩:我們知道只用純的HTML來排版需要用到年夜量做好的圖片來實現，不僅增添了工作量，瀏覽器的兼容結果還很差。此刻我就用設置p標簽的字體來申明問題，可以看到如下的代碼，為了設置P標簽的對其，加粗和顏色用到了良多標簽，若是代碼量在一年夜影響代碼閱讀和美不雅
<html>
<head>
<title>傳統HTML排版</title>
</head>
<body>
這里利用傳統排版設計的結果
</body>
</html>
2
點竄麻煩：從上面一個例子可以看到設置一個P標簽樣式就用到了良多標識表記標幟來實現的，若是一個網頁有良多的P標簽，不僅設置起來麻煩，點竄起來會更麻煩。
<html>
<head>
<title>傳統HTML排版</title>
</head>
<body>
這里利用傳統排版設計的結果
這里利用傳統排版設計的結果
這里利用傳統排版設計的結果
這里利用傳統排版設計的結果
這里利用傳統排版設計的結果
</body>
</html>
可以看到如上的代碼我們需要找到P標簽，在找到需要點竄的屬性一個一個的點竄。
3
功能嚴重不足：我們知道要設置一個標簽的樣式，需要用到HTML供給的各類屬性，若是HTML沒有這個屬性那么我們就無法利用，來點竄。好比下面這個例子，用color="red"直接來設置P的顏色，可以發現如下圖的執行成果，是不是沒有用果，因為P標簽原本就沒有color這個屬性，所以我們無法利用這個來設置顏色。
<html>
<head>
<title>傳統HTML排版</title>
</head>
<body>
這里利用傳統排版設計的結果
這里利用傳統排版設計的結果

</body>
</html>

為什么要用CSS？

1
CSS排版功能齊備：用CSS來排版文字我們就有設心猿意馬文字的字體、顏色、巨細、段失白，首字下沉、首行縮進、中文字的截斷、固心猿意馬寬度詞等等的設置。還有其他的各類css文件的設置，所用用CSS來排版文件是HTML的首選，值得鼎力利用。下面就是我用css來做的一個實例，
<html>
<head>
<title>CSS排版</title>
</head>
<body>
用CSS來排版文件

</body>
</html>
可以看到完美的實現了這個功能。
2
CSS的排版文件可以或許自力存在，可以共用排版：利用傳統的html文件，只能將標簽和屬性連系起來利用，一個標簽一個文件必需連系起來才能用。可是用CSS文件來設置網頁的樣式的話就可以將樣式屬性和網頁標簽分隔來利用，不僅可以或許作為外部文件還能在多個項目中挪用同樣的樣式表，增添了可重用性和簡化編碼的能力和效率。如下圖就將CSS零丁做當作了一個文件。