盒子模型

css层叠性

行内样式 > ID样式 > 类别样式 > 标记样式

如果给同一个标签定义相同的属性，在样式文件里，底下的文件会覆盖上面的文件





链接文字的状态

a:link           链接
a:visited      访问后

a:hover       鼠标经过
a:active       鼠标点击时

做企业站关于链接文字的状态常用以下几种：

1.链接文字默认没有下划线，鼠标经过有下划线，访问后没有下划线（普通企业站）

2.链接文字都没有下划线，可能默认链接时一种颜色，鼠标经过变一种颜色（普通企业站）

3.链接文字默认有下划线，鼠标经过有下划线并且可以变颜色（新闻站用的多）

注意：通常情况下，链接和访问后的状态是相同的



text-decoration用于控制链接文字要不要下划线

text-decoration:none;没有下划线

text-decoration:underline;有下划线

font-weight:normal; 让文字不加粗

font-weight:bold 加粗


<span></span>内联元素，本身不带有任何样式

如果我的DIV宽度就必须固定为980px，但是又加1px的边框，那么div的width就应该写成978px


大盒子宽度

大盒子总宽度＝第一个盒子宽度＋间距（第一个到第二个之间的距离）＋第二个盒子宽度＋间距＋第三个盒子宽度＋左右的边框

980px

大盒子总高度＝第一个盒子高度＋间距（第一个到第二个之间的距离）＋第二个盒子高度＋间距＋第三个盒子高度＋上下的边框

结合元素选择器

类选择器可以结合元素选择器来使用。

例如，您可能希望只有段落显示为红色文本：

p.important {color:red;}

选择器现在会匹配 class 属性包含 important 的所有 p 元素，但是其他任何类型的元素都不匹配，不论是否有此 class 属性。选择器 p.important 解释为：“其 class 属性值为 important 的所有段落”。 因为 h1 元素不是段落，这个规则的选择器与之不匹配，因此 h1 元素不会变成红色文本。

如果你确实希望为 h1 元素指定不同的样式，可以使用选择器 h1.important：

p.important {color:red;}
h1.important {color:blue;}

CSS 多类选择器

在上一节中，我们处理了 class 值中包含一个词的情况。在 HTML 中，一个 class 值中可能包含一个词列表，各个词之间用空格分隔。例如，如果希望将一个特定的元素同时标记为重要（important）和警告（warning），就可以写作：

<p class="important warning">
This paragraph is a very important warning.
</p>

这两个词的顺序无关紧要，写成 warning important 也可以。

我们假设 class 为 important 的所有元素都是粗体，而 class 为 warning 的所有元素为斜体，class 中同时包含 important 和 warning 的所有元素还有一个银色的背景 。就可以写作：

.important {font-weight:bold;}
.warning {font-style:italic;}
.important.warning {background:silver;}


复合选择器：就是两个或者多个基本选择器，通过不同方式连接而成的选择器
有两种情况：”交集“选择器、“并集”选择器 
1。“交集”选择器：由两个选择器直接连接构成，其结果是选中二者各自元素范围的交集，其中第一必须是标记选择器，第二个必须是类别选择器或者ID选择器，两个选择器之间不能有空格，必须连续书写
如：h3.class{color:red;font-size:23px;}

2。“并集”选择器：同时选中各个基本选择器所选择的范围，任何形式的选择器都可以，并集选择器是多个选择器通过逗号连接而成的，
格式如:h1,h2,h3{color:red;font-size:23px;}



margin值计算规则
1.如果两个对象在一行里，第一个对象加了右边距，第二个对象加了左边距，那么margin值等两个边距之和;

2.如果两个对象在二行，上面对象加了下边距，下面对象加了上边距，则取magin最大的值