HTML5块级元素和行内元素

前端的学习丰富多彩，掌握块级元素和行内元素对于一名前端程序员来说是必不可少的，那么下边我就来分享一下自己对于块级元素和行内元素的理解何认识吧。

块级元素

1.作用：搭建网页结构

2.块级元素特性：

（1）独占一行

由运行结果可见，两个div分别独占一行

 

（2）默认宽度为100%

（3）默认高度由内容撑开

（4）可以设置其高度和宽度

建议：不要将块级元素嵌套在行内元素当中

3.常见的块级元素有：

html、body、div、p、h1-h6、ul->li、ol->li、dl->dd/dt...等

行内元素

1.作用：在网页结构中填充网页内容

2.行内元素特性：

（1）高宽由自身决定

 

（2）可以和其他行内元素共享一行空间

 

（3）不可以设置高度和宽度

可以发现对于行内元素而言，即使我为其设置了宽度和高度，它的宽和高已然不会变，所以说行内元素不可设置其宽度和高度

 

 

建议：行内元素中不要嵌套块级元素

3.常见的行内元素有：

span、a、em、i、strong、img、sub、sup...等