作为一名后端程序员，经常会接触到这些概念。以前也仅仅知道，块级元素和内联元素的简单区别。现在的工作中已经离不开前端了，所以想深入了解下块级元素和内联元素的区别，为之后的前端学习多打一点基础。
块级元素具有以下特点:
因此，如果我们想让块级元素自动适应父元素的宽度，就不要给块级元素设置宽度或者设置一个 100%的宽度，这样反而不好维护。
HTML中常见的块级元素:
, ,
内联元素通常有以下特点:
HTML中常见的内联元素:
, , , , , , ,
如前面所说，我们可以很清晰的分辨块级元素和内联元素： 块级元素是结构型元素,内联元素是基于文本的，这是一种很容易区别块级元素和内联元素的方式。
一般来讲，我们可以将任何块级元素放入嵌套在一个块级元素中，也可以将任何内联元素嵌套在块级元素中或者将内联元素嵌套在内联元素中，但是不能将块级元素放在内联元素中，有一个例外的元素是 ，可以将任何元素放置在 元素中。
我们可以使用 属性将块级元素和内联元素进行转换。
有一点需要注意的是，从CSS的角度来说，块级元素和内联元素是存在的，但是在HTML5，不同类型的元素的已经被重新分类。具体的可以参考如下HTML5文档： content models。
在文章开头提到，块级元素和内联元素是两种基本类型。总得来说，它们仅仅是基本类型中的两种，而且我们不必要为其他类型的元素而担心。
还有一种特别的元素叫， 替换元素（Replaced Elements）。它既不属于块级元素也不属于内联元素。关于替换元素的详细内容，可以参考这篇文章: Replaced Elements。