高度坍塌 成因 父元素 div 未设置高度 子元素全部设置浮动（float: left | right;），浮动元素 脱离文档流 且 不占页面空间 由于父元素为设置高度，高度靠内部子元素撑开，而今子元素全部脱离文档流，所以此时父元素的高度为 0，给父元素和子元素设置 边框（border: 1px s ...
分类：
Web程序 时间：
2020-10-19 22:56:44
阅读次数：
31
所有HTML标签都是盒子模型 div标签自定义盒子模型 class和id的主要差别是：class用于元素组（类似的元素，或者可以理解为某一类元素），而id用于标识单独的唯一的元素。 盒子模型组成部分： 自身内容：width、height 宽高内边距： padding盒子边框： border 边框线与 ...
分类：
Web程序 时间：
2020-09-17 16:35:58
阅读次数：
44
div标签自定义盒子模型class和id的主要差别是：class用于元素组（类似的元素，或者可以理解为某一类元素），而id用于标识单独的唯一的元素。 自身内容：width、height 宽高内边距： padding盒子边框： border 边框线与其他盒子距离： margin 外边距内容+内边距+边 ...
分类：
Web程序 时间：
2020-09-17 16:26:29
阅读次数：
37
可能在初学前端的同学，会有以下疑惑: (没错,那同学就是我) 1、为什么在浮动元素的父元素上添加overflow:hidden，能处理高度塌陷？ 2、遇到外边距合并，为什么要在父元素上添加overflow:hidden能解决？ 首先来了解下 什么是BFC吧！ 1、按我的理解，BFC是一个大的隔离独立 ...
分类：
其他好文 时间：
2020-08-26 19:00:24
阅读次数：
63
知识点一：外边距 1、回顾盒子模型包含：内容、内边距、边框、外边距 2、定义：盒子的边框与其他元素或者浏览器边缘之间的距离 3、使用： ① 上外边距 margin-top: 100px; ② 左外边距 margin-left: 80px; ③ 下外边距 margin-bottom: 50px; ④ ...
分类：
Web程序 时间：
2020-08-18 15:37:29
阅读次数：
108
CSS盒子模型 1. 盒子模型的组成 CSS盒子模型本质上是一个盒子，封装周围的HTML元素。 包括：边框border、外边距margin、内边距padding、实际内容content。 2. 边框border div { border: border-width border-style bord ...
分类：
Web程序 时间：
2020-08-09 17:57:49
阅读次数：
82
## 外边距塌陷 ### 产生原因 - 相邻块元素垂直外边距合并 - 兄弟块元素，同时设置不同的 `margin-top` 值，两个的 `margin-top` 最后展示的都是最大的 `margin-top` 的效果。 - html ```html ``` - style ```css .broth... ...
分类：
其他好文 时间：
2020-08-04 09:44:29
阅读次数：
74
1.盒子模型主要定义四个区域：内容（content）、内边距（padding）、边框（border）、外边距（margin） 2.border，设置元素的边框，属性（边框三要素）：宽度、样式、颜色，这也是通常border属性值的书写顺序（非严格要求） 单独书写：border-width（宽度，默认3 ...
分类：
Web程序 时间：
2020-07-24 09:46:07
阅读次数：
103
盒模型主要有四个区域： 内容content 内边距padding 外边距margin 边框border 实现让块状元素居中 margin:auto; margin：上 右 下 左 上下外边距合并 ...
分类：
Web程序 时间：
2020-07-18 22:27:34
阅读次数：
79
外边距：margin margin-top： margin-right: margin-bottom: margin-left: 简写方式： margin：30px；（上下左右都30px） margin：30px 50px；（上下，左右） margin：上 右 下 左； ...
分类：
其他好文 时间：
2020-07-18 15:57:14
阅读次数：
58
