CSS
JJYdesu
这个作者很懒,什么都没留下…
展开
-
width&min-width&max-width的关系
min-width和max-width分别限制了元素的最小宽度和最大宽度,当浏览器缩小导致元素宽度小于min-width时,元素的width就会被min-width的值取代,浏览器出现滚动条来容纳元素,如果像下面这样写: .container { width: 600px; height: 300px; background-color: red; min-width: 500px; }实际上这样直接设定了width为600px,原创 2021-10-03 21:33:14 · 656 阅读 · 0 评论 -
BFC布局规则
BFC布局规则如下:内部的Box会在垂直方向上一个接一个的放置。内部的Box垂直方向上的距离由margin决定,要注意的是BFC内的块级元素依然会有外边距折叠,但可以在元素外用BFC来包裹,解决相邻元素间外边距折叠问题。BFC的区域不会与float的元素区域重叠。计算BFC的高度时,浮动子元素也参与计算。意味着可以利用BFC解决浮动带来的高度塌陷的文通。BFC就是页面上的一个独立容器,容器里面的子元素不会影响外面元素。意味着可以用给父元素设置BFC,解决margin-top塌陷的问题。..原创 2021-10-03 17:48:53 · 280 阅读 · 0 评论 -
子元素的margin-top作用在父元素上
这是因为css的外边距合并规则。两个相邻或嵌套的块级元素其外边距会合并为一个外边距,相邻的元素表现出两个外边距取大的那个,而嵌套的元素则表现为子元素设置margin-top,作用在父元素上。解决方案如下:将父元素设置为BFC。父元素设置padding-top,取代子元素设置margin-top,能达到同样的效果。...原创 2021-10-03 17:08:28 · 585 阅读 · 0 评论 -
【CSS笔记】浮动
目录1.定位方式2.浮动的特点3.浮动的缺点4.清除浮动1.定位方式首先CSS中有以下五种定位方式:文档流定位:默认的定位方式,块级元素从上到下排列,行内元素从左到右排列。浮动定位:设置float:left/right,该定位方式会导致元素脱离文档流。相对定位:相对元素原来的位置偏移,原本的空间会被保留。绝对定位:脱离文档流,不占据页面空间。固定定位:将元素固定在某个位置,不随着滚动条而发生位置变化。2.浮动的特点引用大佬的总结,浮动有四个特点:脱标:脱离文档流。正常的div会像原创 2021-07-28 11:07:22 · 120 阅读 · 0 评论