课程名称：网页设计技术；实验名称：CSS+Div基础
【实验目的】
1、掌握CSS,Div的基本概念及其作用；
2、熟练掌握CSS中常用属性的作用及应用；
3、理解并掌握CSS+Div在网页布局中的作用。
【实验仪器】
PC, Dreamweaver
【预习内容】
CSS+Div基础
预习报告正文：
1. 写出下列的css样式：
声明P的字体颜色为蓝色，字体大小18px，缩进20px。
P{
Font-size:18px;
Color:blue;
Letter-spacing:20px;
}
声明类myFont的背景颜色为红色，边框为1px白色实体框，字体中间对齐。
.myFont{
text-align:center;
Border:1px solid white;
background-color:red;
}
声明ID为myDiv的背景图片为（images/header.jpg），并不重复出现和居中。
#myDiv{
background-image: url(images/header.jpg);
background-repeat: no-repeat;
background-position: center;
}
2. 写出CSS的三大特性，并各举一个例子说明。（只需要写出css部分和主要HTML代码部分即可）
答：
CSS有三个非常重要的三个特性：层叠性、继承性、优先级。
1.层叠性：
相同选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一个冲突的样式。层叠性主要解决样式冲突的问题。
层叠性原则：
- 样式冲突，遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式
- 样式不冲突，不会层叠
层叠性示例：
Div{
Font-size:18px;
Color:red;
}
Div{
Color:green;
}
最终div标签内的颜色是green。
2.继承性：
子标签会继承父标签的某些样式，如文本颜色和字号。
继承性示例：
</head>
<style type = “text/css”>
Div{
Font-size:18px;
Color:red;}
</style>
</head>
<body>
<div><p>p标签中的内容会继承div标签的属性</p></div>
</body>
3.优先级：
当同一个元素指定多个选择器，就会有优先级的产生。
- 选择器相同，则执行层叠性
- 选择器不同，则根据选择器权重执行
优先级示例：
<style>
.test {
color: red;
}
div {
color: pink!important;
}
#demo {
color: green;
}
</style>
</head>
<body>
<div class="test" id="demo" style="color: purple;">优先级演示</div>
</body>
