这是一个面向零基础的前端教程,很简单,用零散时间就可以学习。
推荐早上读一下,晚上复习一下,如果可以奢侈一点,白天稍微练习一下下,总共花费 5~15 分钟。就酱!
已经好几次提到块(block)元素了,但都没有仔细讲解它的特征,现在开始来稍微认识一下。
nav 这个元素就是一个块元素。我们加上背景以后,可以观察到它的宽度是从左边到右边占满的。块元素的宽度默认是 100%。
如果你写一个 div,然后给他设置背景是看不见的,因为它的高度是0没有面积,所以并不会显示出来。如果你给他一个高度,或者在里面放上内容,将它的高度撑开就能够看到了。
但如果不给高度只给宽度,因为高度为 0,面积依然为 0,所以还是看不见。
给了高度,给了宽度,当他占不满整个宽度的时候,就会靠左侧显示。那如果有连续的几个块元素,即便宽度足够让他们并排(水平排列),他们依然会每一个占据一行纵向排列。
上面这些内容都可以自己动手尝试来体会一下。下面的内容先了解一下理论,我们后面再慢慢的深入。
我们称他为盒子,但实际上是二维的,所以他有上下左右 4 个边框。默认情况下边框是没有宽度的,也不会显示出来,当然我们可以设置边框的宽度和样式等。
盒子里面当然可以装内容,盒子里面也可以套盒子。在盒子边框的内侧,我们还可以“垫”东西,这样盒子里装的内容和盒子的边框之间就隔开了距离,这叫做内补,就是在盒子的内壁补充了一部分空间。
反之还有外补,就是在盒子的外面补充了一部分空间,可以使相邻的盒子之间隔开距离。
>>>=== 小老鼠卖着萌走过去的分割线 ===<<<
学习的秘诀就在于坚持下去,可以通过给文章点赞来打卡学习。也让小老鼠了解到有人在看,然后更努力的更新。坚持,一起哦~
有疑问,有想法,有理解……都可以写在评论里。听懂了不等于会使用,会使用不等于能讲出来。尝试讲出自己的理解,是很好的学习方法呢~(小老鼠就在这样学习着,可爱!
可以来微信群一起讨论嗷~~【前端小课堂】微信群
这么可爱的小老鼠……Rua!这么简单的小教程,就学一下呗~~
【决心】学习的,可以找小老鼠,用小“鞭子”督促你~(收费哦,还贵呢~~