H5：入门笔记三

块级元素

常见的块元素有<h1>~<h6>、<p>、<div>、<ul>、<ol>、<li>等，其中<div>标签是最典型的块元素

块级元素的特点：

• 1）总是从新行开始
• 2）高度，行高、外边距以及内边距都可以控制。
• 3）宽度默认是容器的100%
• 4）可以容纳内联元素和其他块元素。

行内元素

常见的行内元素有<a>、<strong>、<b>、<em>、<i>、<del>、<s>、<ins>、<u>、<span>等，其中<span>标签最典型的行内元素。

行内元素的特点：

• 1）和相邻行内元素在一行上。
• 2）高、宽无效，但水平方向的padding和margin可以设置，垂直方向的无效。
• 3）默认宽度就是它本身内容的宽度。
• 4）行内元素只能容纳文本或则其他行内元素。（a特殊 a里面可以放块级元素 ）

行内块元素

<img />、<input />、<td>

行内块元素的特点：

• 1）和相邻行内元素（行内块）在一行上，但是之间会有空白缝隙。
• 2）默认宽度就是它本身内容的宽度。
• 3）高度，行高、外边距以及内边距都可以控制。

标签显示模式转换

块转行内：display:inline;
行内转块：display:block;
块、行内元素转换为行内块： display: inline-block;

---

CSS 三大特性

• 层叠性：

  • 1. 样式冲突，遵循的原则是就近原则。 那个样式离着结构近，就执行那个样式。
  • 2. 样式不冲突，不会层叠。

• 继承性
  书写CSS样式表时，子标签会继承父标签的某些样式，如文本颜色和字号。想要设置一个可继承的属性，只需将它应用于父元素即可。
  注意：恰当地使用继承可以简化代码，降低CSS样式的复杂性。子元素可以继承父元素的样式（text-，font-，line-这些元素开头的都可以继承，以及color属性）

• 优先级
  继承样式的权重为0。即在嵌套结构中，不管父元素样式的权重多大，被子元素继承时，他的权重都为0，也就是说子元素定义的样式会覆盖继承来的样式。

  行内样式优先。应用style属性的元素，其行内样式的权重非常高，可以理解为远大于100。总之，他拥有比上面提高的选择器都大的优先级。

  权重相同时，CSS遵循就近原则。也就是说靠近元素的样式具有最大的优先级，或者说排在最后的样式优先级最大。

  CSS定义了一个!important命令，该命令被赋予最大的优先级。也就是说不管权重如何以及样式位置的远近，!important都具有最大优先级。

继承或者* 的贡献值	0,0,0,0
每个元素（标签）贡献值为	0,0,0,1
每个类，伪类贡献值为	0,0,1,0
每个ID贡献值为	0,1,0,0
每个行内样式贡献值	1,0,0,0
每个!important贡献值 重要的	∞ 无穷大