css基础之块级与行级元素

常见块级元素:

<h1><h6>、<p>、<div>、<ul>、<ol>、<li>

特点:每个块元素通常会独自占据一整行或多整行，可以对其设置宽度、高度、对其等属性，常用于网页布局和网页结构的搭建。

 

常见行内元素：<strong>、<h>、<em>、<i>、<del>、<s>、<ins>、<u>

<a>、<span>

特殊行内标记<img/>、<input>、<td> 可以对它们设置宽高和对齐方式

 

特点:不必在新的一行开始，同时，也不强迫其他元素在新的一行显示。一个行内元素通常会和它前后的其他行内元素显示在同一行中，他们占有独立的区域，仅仅靠自身的字体大小和图像尺寸来支撑结构，一般不可以设置宽度、高度、对齐等属性，常用于控制页面中文本的样式。

 

元素的转换

网页是由多个块元素和内行元素构成盒子排列而成的。如果希望行内元素具有块元素的某些特性，例如可以设置宽高，或者需要块元素具有行内元素的某些特性，例如不独占一行排列，可以使用display属性对元素的类型进行转换。

Display 属性常用属性值以及含义如下:

1.    inline:此元素将显示为行内元素（行内元素默认为display属性值）.

2.    Block:此元素将显示为块元素(块元素默认的display属性值)

3.    Inline-block:此元素将显示为行内块元素，可以对其设置宽高和对齐等属性，但是该元素不会独占一行。

4.    None：此元素将被隐藏，不显示，也不占用页面空间，相当于该元素不存在。