qq_35876316的博客

则 padding(内边距) 和 border(边框) 也包含在 width 和 height 中,两个 div 现在是一样大小的!CSS3 box-sizing 属性在一个元素的 width 和 height 中包含 padding(内边距) 和 border(边框)。outline-offset 属性对轮廓进行偏移，并在超出边框边缘的位置绘制轮廓。不同的背景图像和图像用逗号隔开，所有的图片中显示在最顶端的为第一张。background-Origin属性指定了背景图像的位置区域。

1、子元素的 top 和 bottom 如果设置百分比，则相对于直接非 static 定位（默认定位）的父元素的高度，同样，子元素的 left 和 right 如果设置百分比，则相对于直接非 static 定位（默认定位的）父元素的宽度。比如，当浏览器的宽度或者高度发生变化时，通过百分比单位可以使得浏览器中的组件的宽和高随着浏览器的变化而变化，从而实现响应式的效果。如果移动端有 5 个不同的视口宽尺寸 750 ，640，480，375，320，则在不同尺寸下，对应的 1vw 的 px 值如下表。

介绍了相关display:flex 的属性：https://blog.youkuaiyun.com/weixin_38606332/article/details/80867844

水平居中：对于行内元素：text-align:center；对于确定宽度的块级元素：1.width加margin实现，width固定宽度，margin: 0 auto;2.绝对定位和margin-left:width/2，前提是父元素position:relative;对于宽度未知的块级元素：1.table标签配合margin左右auto实现水平居中。使用table标签（或...

一行代码实现五种 CSS 经典布局常用的页面布局，其实就那么几个。下面我会介绍5个经典布局，只要掌握了它们，就能应对绝大多数常规页面。这几个布局都是自适应的，自动适配桌面设备和移动设备。代码实现很简单，核心代码只有一行，有很大的学习价值，内容也很实用。我会用到 CSS 的Flex 语法和Grid 语法，不过只用到一点点，不熟悉的朋友可以先看看教程链接，熟悉一下基本概念。每一个布局都带有 CodePen 示例，也可以到这个网页统一查看。本文是跟极客大学合作的前端学习讲座的一部分，详见..

<div class="out">　　<div class="a"></div>　　<div class="b"></div>　　<div class="c">当父DIV高度变化随里面DIV高度不同而变化的时候，子DIV仍然能充满高度。</div></div>.out{　　　border:1px solid #c0c0c0;　　overflow:hidden;}.out div{