CSS网页样式详解-优快云博客

本文链接：https://blog.youkuaiyun.com/Submoon_/article/details/78295847

一、什么是CSS？

层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。我个人理解就是用于美化HTML、XML这类网页文档的一个标记集合。

二、为什么要用CSS？

我们知道HTML也可以在其标签中设置属性来更改页面的格式类型，但为什么还需要用CSS呢？岂不是多此一举么？

假设你希望一个文档中的所有h2标题都是紫色。若使用HTML，则要在每个标题中增加一个font标记，如下所示：

<h2><font color="purple">This is purple!</font></h2>

所有二级标题都要增加这个标记。如果文档中有50个这样的标题，就必须总共插入50 个font元素，每个标题插入一个font！为了达到这样小的一个效果，就要做这么多的工作。

更好的办法是使用这样一条规则：

h2 {
    color: purple;
}
这样做不仅输入起来更快，修改起来也更容易。如果要修改多个文档中的颜色，所要做的只是修改这一条规则。
这样做不仅输入起来更快，修改起来也更容易。如果要修改多个文档中的颜色，所要做的只是修改这一条规则。

三、结合CSS和XHTML

看一个XHMTL文档的例子：

<!DOCTYPE html>
<html>
<head>
    <title>CSS</title>
    <link rel="stylesheet" type="text/css" href="sheet1.css" media="all">
    <style type="text/css"> @import url(sheet2.css);
        h1 {color: maroon;}
        body {background: yellow;}
    </style>
</head>
<body>
    <h1>HelloWorld!</h1>
    <p>This is the first page...</p>
</body>
</html>