为什么要用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零丁做当作了一个文件。