行内元素，块级元素与空元素

行内元素：a、b、span、img、input、strong、select、label、em、button、textarea

块级元素：div、ul、li、dl、dt、dd、p、h1-h六、blockquote

空元素:br、meta、hr、link、input、img

 

块级元素的特色：

1.总在新行上开始，占据一整行
2.默认状况下，其宽度自动填满其父元素宽度
3.宽度始终是与浏览器宽度同样，与内容无关
4.它能够容纳内联元素和其余块元素
5.display属性为block

 

块级元素的垂直相邻外边距margin会合并。

行内元素的特色：

1.和其余元素都在一行上
2.高，行高及外边距和内边距部分可改变
3.宽度只与内容有关
4.行内元素只能容纳文本或者其余行内元素
5.display属性为inline

水平方向的padding-left、padding-right、margin-left、margin-right都产生边距效果，
但竖直方向的padding-top、padding-bottom、margin-top、margin-bottom却不会产生边距效果。
不能够设置宽高，其宽度随着内容增长，高度随字体大小而改变，内联元素能够设置外边界，可是外边界不对上下起做用，只能对左右起做用。

 

空元素的特色：

 

没有内容的 HTML 内容被称为空元素。空元素是在开始标签中关闭的。
<br /> 就是没有关闭标签的空元素（<br /> 标签订义换行）。
在 XHTML、XML 以及将来版本的 HTML 中，全部元素必须被关闭。
在开始标签中添加斜杠，好比 <br />，是关闭空元素的正确方法，HTML、XHTML 和 XML 都接受这种方式。
即便 <br> 在全部浏览器中都是有效的，但使用 <br /> 实际上是更长远的保障。

 

转载请联系