CSS:盒子_每个元素都有两个盒子(《CSS世界笔记》-块级元素)

1)CSS世界只有"块级盒子(block-level box)"和"内联盒子(inline box)"。块级盒子就负责结构,内联盒子就负责内容。
 
2)每个元素都两个盒子,外在盒子和内在盒子。"外在盒子"负责元素是可以一行显示,还是只能换行显示;"内在盒子"负责宽高、内容呈现什么的。"内在盒子"也可以叫作“容器盒子”。
现在,大家应该明白为何display属性值是inline-block的元素既能和图文一行显示,又能直接设置 width/height 了吧!因为有两个盒子,外面的盒子是 inline 级别,里面的盒子是 block 级别。实际上,如果遵循这种理解,display:block 应该脑补成 display:block-block,display:table 应该脑补成 display:block-table,我们平时的写法实际上是一种简写。
 
思考

-width/height 作用在哪个盒子上?
“内在盒子”即“容器和盒子”。参考上面的笔记2。
 
来自《CSS世界》-张鑫旭◎著,本书籍网站https://www.cssworld.cn/
 
 

最新文章

  1. Java程序:从命令行接收多个数字,求和并输出结果
  2. GJM : 游戏程序员的学习之路
  3. WinForm窗体间传值
  4. php调用微信发送自定义模版接口
  5. 49. Anagrams
  6. 【HDOJ】1979 Fill the blanks
  7. linux用户创建删除以及文件权限查看修改
  8. 【Itext】7步制作Itext5页眉页脚pdf实现第几页共几页
  9. update和saveOrUpdate具体解释
  10. python的try方法中的else和finally的区别
  11. 阿里聚安全移动安全专家分享:APP渠道推广作弊攻防那些事儿
  12. sysbench
  13. vue 特点
  14. reat + cesium。 实现 初始化时自动定位,鼠标移动实时展示坐标及视角高度, 淹没分析
  15. 创建数组必须指定数组数目之new运算符避免这种限制
  16. Spring Boot Admin 的使用
  17. 委托、多播委托(MulticastDelegate)
  18. Extjs表单验证小结
  19. MySQL数据库----触发器
  20. InstallShieldPro 2015中Basic MSI工程类型如何调用InstallScript脚本

热门文章

  1. 学会了selenium 模拟鼠标操作,你就可以偷懒点点点了
  2. 德摩根定律的证明 De Morgan's law
  3. 【Dubbo3 终极特性】「云原生三中心架构」带你探索 Dubbo3 体系下的配置中心和元数据中心、注册中心的原理及开发实战(中)
  4. 我居然不知道Vue3可以使用hooks函数实现代码复用?
  5. Java入门与进阶 P-1.9+P-1.10
  6. 练习_使用递归计算1-n之间的和-练习_使用递归计算阶乘
  7. RESTful相关信息整理
  8. countdownlatch应用场景
  9. 重学SpringBoot. step2 Spring AOP
  10. 复制内容到剪切板通用的js方法