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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  1. 两个相邻盒子的边框怎么只显示一个_一篇文章带你快速理解盒子模型「经典案例」...

    今天带大家快速理解盒子模型,直接上代码: css盒子 我的css盒子测试模型 上面代码没有任何难度,只是写了一个div标签,大家已经知道,div标签是块级元素,所以会占满一行: 但是我们也注意到了图片 ...

  2. 解决Excel 2010打开两个以上文件时，总只显示一个窗口

    用Excel 2010打开两个以上文件时,总只显示一个窗口. 解决方法,打开注册表编辑器,(点运行,输入regedit)定位到 HKEY_CLASSES_ROOT\Excel.Sheet.12\she ...

  3. 计算机显示另外一个用户登录,电脑两个用户怎么在欢迎界面只显示一个?

    如果设置了一个管理员账户,那么系统内置没有密码保护的Administrator管理员账户是不会出现在用户登录列表中的.所以是来宾用户不要设置成管理员账户了. 1使用"传统登录提示" ...

  4. php只显示一部分文章,typecho同一个页面下调用不同分类的文章但是却只显示一个分类文章...

    typecho同一个页面下调用不同分类的文章但是却只显示一个分类文章 作者:佚名 来源:爱好者 时间:2018-04-30 问题描述: 同页面调用分类下文章,只显示一第一个分类下的文章 在一个页面中, ...

  5. php怎么只显示一页网页,授课时电脑投屏怎么只显示一个页面

    授课时电脑投屏怎么只显示一个页面 有网友留言:"授课时电脑投屏怎么只显示一个页面的,大屏幕自带手写批注功能,支持在大屏幕上授课." 像这种需求的应用案例不在少数,还记得在4月份的时 ...

  6. Teamviewer连接服务器显示不能够全屏 或 向日葵连接服务器不能够全屏 或 Teamviewer只显示一个640x480的分辨率选项

    欢迎大家关注笔者,你的关注是我持续更博的最大动力 原创文章,转载告知,盗版必究 Teamviewer连接服务器显示不能够全屏 或 向日葵连接服务器不能够全屏 或 Teamviewer只显示一个640x ...

  7. win7系统的右键菜单只显示一个白色框不显示菜单项 解决办法

    如上图所示,桌面或其他大部分地方点击右键菜单,都只显示一个白色框,鼠标移上去才有菜单项看,并且效果很丑 解决办法: 计算机-右键-属性-高级-性能-设置-视觉效果-淡入淡出或滑动菜单到视图,将其前面的 ...

  8. qt自定义按钮类，每个按钮自带一个右键弹出框，如何使同一时刻只显示一个弹出框

    提要 继承于QPushButton的自定义按钮类,其右键弹出一个弹框,创建多个这样的自定义按钮在窗口中,每一时刻只显示一个右键弹出框,避免同一时刻,多个按钮右键弹出弹出框后,未及时关闭弹出框导致的同一 ...

  9. win7笔记本外接显示器html,window7笔记本外接显示器只显示一个屏幕怎么设置

    许多用户都会偏向于入手win7笔记本电脑,这样电脑携带起来也是非常方便,不过由于屏幕较小的缘故,有用户就会选择外接一台显示器,不过在给win7笔记本外接显示器之后就需要对于其进行设置只显示一个屏幕,接 ...

最新文章

  1. 【计算机组成原理系列学习三】关于CPU、指令集、架构以及芯片
  2. placement new(转)
  3. php xml 四种,xml中常见的四种解析方式是什么？
  4. USACO2.4の其中3道水题【模拟,图论】
  5. MySQL中使用CASE出错,如何在MySQL中正确使用CASE..WHEN
  6. 将python代码编译成.so文件
  7. 两校合并！新部属大学，来了！
  8. 引入ui组件_Vuejs, Semantic CSS前端框架fish-ui
  9. 非root用户组启动sftp_如何在 Debian 10 中配置 Chroot 环境的 SFTP 服务 | Linux 中国
  10. matlab mex 矩阵,如何从mex函数访问matlab结构字段中的矩阵？
  11. mysql 从后往前截取指定个数字符串_「截取字符串」substring从指定字符串开始截取 - seo实验室...
  12. Vue3学习笔记(B站李南江)
  13. 表单获取焦点和失去焦点
  14. net user administrator /passwordreq:yes 错误
  15. 常识性知识，高速快捷知识
  16. 实现页面的图文混排布局（Web作业）
  17. 【MAYA】模型生长
  18. java 大臣的旅费_蓝桥杯 大臣的旅费（Java dfs）
  19. Squid之传统代理和透明代理解析实验步骤
  20. linux系统下（x86_64）安装jdk 1.6(jdk-6u45-linux-x64.bin)

热门文章

  1. eclipse启动发生Failed to load JNI shared library
  2. mysql外部排序_深入浅出MySQL优先队列(你一定会踩到的order by limit 问题)
  3. C语言指针原来也可以这么的通俗易懂！
  4. php curl cookie,php中curl获取返回页面的cookie
  5. hive 导出json格式 文件_Hive 系列 之 基本操作合集
  6. xbox手柄接收器驱动_xbox手柄连接 win10电脑
  7. corssover linux运行无效,使用 CrossOver 在 Linux运行 Windows 软件(金测OK)
  8. torch.cuda.is_available()，torch.cuda.device_count()，torch.cuda.get_device_name(0)
  9. telnet 功能启用并测试端口是否正常
  10. 第 11 章 日志管理 - 089 - 初探 ELK