两个相邻盒子的边框怎么只显示一个_【前端小课堂】0044 盒子

这是一个面向零基础的前端教程，很简单，用零散时间就可以学习。 

推荐早上读一下，晚上复习一下，如果可以奢侈一点，白天稍微练习一下下，总共花费 5~15 分钟。就酱！

已经好几次提到块(block)元素了，但都没有仔细讲解它的特征，现在开始来稍微认识一下。

nav 这个元素就是一个块元素。我们加上背景以后，可以观察到它的宽度是从左边到右边占满的。块元素的宽度默认是 100%。

如果你写一个 div，然后给他设置背景是看不见的，因为它的高度是0没有面积，所以并不会显示出来。如果你给他一个高度，或者在里面放上内容，将它的高度撑开就能够看到了。

但如果不给高度只给宽度，因为高度为 0，面积依然为 0，所以还是看不见。

给了高度，给了宽度，当他占不满整个宽度的时候，就会靠左侧显示。那如果有连续的几个块元素，即便宽度足够让他们并排(水平排列)，他们依然会每一个占据一行纵向排列。

上面这些内容都可以自己动手尝试来体会一下。下面的内容先了解一下理论，我们后面再慢慢的深入。

我们称他为盒子，但实际上是二维的，所以他有上下左右 4 个边框。默认情况下边框是没有宽度的，也不会显示出来，当然我们可以设置边框的宽度和样式等。

盒子里面当然可以装内容，盒子里面也可以套盒子。在盒子边框的内侧，我们还可以“垫”东西，这样盒子里装的内容和盒子的边框之间就隔开了距离，这叫做内补，就是在盒子的内壁补充了一部分空间。

反之还有外补，就是在盒子的外面补充了一部分空间，可以使相邻的盒子之间隔开距离。

>>>=== 小老鼠卖着萌走过去的分割线 ===<<<

学习的秘诀就在于坚持下去，可以通过给文章点赞来打卡学习。也让小老鼠了解到有人在看，然后更努力的更新。坚持，一起哦~ 

有疑问，有想法，有理解……都可以写在评论里。听懂了不等于会使用，会使用不等于能讲出来。尝试讲出自己的理解，是很好的学习方法呢~(小老鼠就在这样学习着，可爱！

可以来微信群一起讨论嗷~~【前端小课堂】微信群

这么可爱的小老鼠……Rua！这么简单的小教程，就学一下呗~~

【决心】学习的，可以找小老鼠，用小“鞭子”督促你~(收费哦，还贵呢~~