以下是今天学习的内容：
1.继承：CSS的某些样式是具有继承性的，继承是一种规则，它允许样式不仅应用于某个特定html标签元素，而且应用于其后代。就是假如某种颜色应用于p标签，这个颜色设置不仅应用p标签，还应用于p标签中的所有子元素文本。
如<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>继承</title>
<style type="text/css">
p{color:red;}
p{border:1px solid red;}
//span{color:green;}
</style>
</head>
<body>
<h1>勇气</h1>
<p class="first">三年级时，我还是一个<span>胆小如鼠</span>的小女孩，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>
<p id="second">到了三年级下学期时，我们班上了一节公开课，老师提出了一个很<span>简单</span>的问题，班里很多同学都举手了，甚至成绩比我差很多的，也举手了，还说着："我来，我来。"我环顾了四周，就我没有举手。</p>
</body>
</html>
这里的span标签就是p标签的子标签，但是如果将span前的注释去掉，<span>标签之间的文本会跟span设置的颜色一致，而不是跟p标签设置的一样。
二.特殊性：
浏览器是根据权值来判断使用哪种css样式的，权值高的就使用哪种css样式。
标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100.
还有一个权值为比较特殊，就是继承，它有权值但是很少，几乎可以忽略。所以它的权值是最低的。
三：层叠
层叠：就是在html文件中对于同一个元素可以有多个css样式存在，当有相同权值的样式存在时，会根据这些css样式的前后顺序来决定，处于最后面的css样式会被应用。
如<style type="text/css">
{
p{color:red;}
p{color:green;}
} 最终在<p></p>标签之间的文本的颜色是绿色。
就是说后面的CSS样式会覆盖前面的CSS样式。
四：重要性
使用！important可以为某些CSS样式设置为最高权值。
如<p color:red !important;>
<p color:green;>
那么<p>标签之间的文本的最终颜色不是绿色，而是红色。值得注意的是！important必须写在分号之前。
样式优先级：浏览器默认的样式 < 网页制作者样式 < 用户自己设置的样式，但是!important优先级样式是个例外，权值高于用户自己设置的样式。
五，文字排版
1. 字号 ：font-size： ；
2.字体：font-family=" "；
3.文字的样式： 粗体：font-weight：bold； 斜体：font-style:italic；下划线：text-decoration:underline;
删除线：text-decoration:line-through;
4.缩进：text-indent:2em;（em前的数值是为缩进的格式，可根据需求设计）
5.行间距（行高）：line-height:2em;（em前的数值是代表倍数。）
6.中文字间隔：word-spacing:50px; 字母间隔：letter-spacing:50px;
7.对齐：text-align:center；（三种：right：居右 center：居中 left：居左）
自己做的练习：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>这是个练习</title>
<style type="text/css">
.food>li{border:1px solid red;}
.first>span{border:1px solid red;
border-color:#090}/*子选择器,边框，边框颜色*/
.stress{font-size:40px;
text-align:center;
font-weight:bold;}/*类选择器，字号,加粗。*/
#second{font-family:Arial, Helvetica, sans-serif;
font-style:italic;
text-indent:2em;
text-decoration:underline ;
letter-spacing:10px;
word-spacing:10px;
line-height:2em}/*ID选择器，缩进，斜体，字母间距，中文字间距,行高，字体*/
.third{text-decoration:line-through;
text-align:center}/*删除线，对齐方式*/
li{color:#090}
li{color:#F09}/*层叠*/
h1{color:red !important;}
h1{color:green;}/*重要性*/
</style>
</head>
<body>
<div class="stress">练习</div>
<p class="first">三年时，<span>我还是一个<span>胆小如鼠</span>的小女孩</span>，上课从来不敢回答老师提出的问题，生怕回答错了老师会批评我。</p>
<p id="second">就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。test</p>
<p class="third">测试</p>
<h1>食物</h1>
<ul class="food">
<li>水果
<ul>
<li type="square">香蕉</li>
<li>苹果</li>
<li>梨</li>
</ul>
</li>
<li>蔬菜
<ul>
<li>白菜</li>
<li>油菜</li>
<li>卷心菜</li>
</ul>
</li>
</ul>
</body>
</html>
主要的是要知道如何使用ID选择器，类选择器，子选择器等。知道一些基本的文字排版的代码是什么，如何的书写。
543
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
