版权声明：原创文章，转载请附加链接。 https://blog.csdn.net/qq_36749611/article/details/86769332
网页设计
单纯不加修饰的HTML标签设计出来的网页，往往差强人意，达不到想要求的效果。根据W3C提倡的标准，一个良好的页面可以做到内容与样式分离，由XHTML（HTML）负责组织内容结构，由CSS负责表现样式，之前的内容与样式混合的模式将逐渐被淘汰。
CSS简介
CSS（Cascading Style Sheets）是层叠样式表，用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。即通过CSS定义可以展现HTML不同的表现形式。
特点：
- 功能更强大，具有美观的页面效果
- 实现内容和样式的分离，能灵活改变页面外观
- 实现样式复用，方便更新和维护
CSS语法与简单应用
1）CSS使用<style>标签来声明样式规则。如：
<style type="text/css">
选择器1{
对象的属性1：属性值1；
对象的属性2：属性值2；
对象的属性3：属性值3；
......
}
选择器2{
对象的属性1：属性值1；
对象的属性2：属性值2；
对象的属性3：属性值3；
......
}
......
</style>
2）样式表插入
- 外部样式
<link rel="stylesheet" type="text/css" href="css/myStyle.css"/>
myStyle.css是外部CSS文件
也可以使用@import url();引入头文件
二者渲染CSS样式的时机不同，import先完成html标签，再渲染CSS样式，而前者则反之。
- 内部样式
<head>
<style type="text/css">
body{
font-family:Verdana,sanas-serif;}
p{
maragin-left:20px;}
</style>
</head>
- 内部样式
<p style="margin-left:20px">内容</p>
3）示例
- 简单html页面
<html>
<head>
<style type="text/css">
li{
font-style:italic;}
<!--在body中的li标签字体样式为斜体字-->
.center{
text-align:center;
color:red;}
<!--在body页面中选择center类元素的样式为居中且靠右-->
</style>
</head>
<body>
<h3>图书分类</h3>
<ul>
<li>小说</li>
<li>文艺</li>
<li class="center">童话</li>
<li class="center">生活</li>
</ul>
</body>
</html>
ps:CSS最核心的应用是选择器，关于选择器的应用下回分解。