随着互联网发展至今，对于网站来说，性能显的越来越重要了，CSS作为页面渲染和内容展现的重要环节，影响着用户对整个网站的第一体验。所以，我们需要重视与CSS相关的性能优化。

划重点，这是一道面试必考题，很多面试官都喜欢问这个问题，我就被问过好几次了 要实现上图的效果看似很简单，实则暗藏玄机，本文总结了一下CSS实现水平垂直居中的方式大概有下面这些，本文将逐一介绍一下，我将

position（定位） position — 作为css属性三巨头（position、display、float）之一，它的作用是用来决定元素在文档中的定位方式。其属性值有五种，分别是 — stat

xdm，顶顶顶一下！前端开发中常见的浏览器兼容性问题有哪些？怎么解决？点进来看看以后遇到就不怕了，建议码住收藏！！！

CSS 弹性盒布局, display: flex, flex-direction主轴, flex-wrap换行, gap间隔(column-gap row-gap)和不同类型的对齐方式

理解flex属性 在flexbox布局中，flex属性是用来控制项目的伸缩性的。它是一个复合属性，包含了flex-grow、flex-shrink和flex-basis这三个子属性。 在 Flexbo

通俗易懂的大白话。 你懂了吗？懂了。 flex : 1 和 flex : auto 有何区别？

响应式布局指的是同一页面在不同屏幕尺寸下有不同的布局。传统的开发方式是PC端开发一套，手机端再开发一套，而使用响应式布局只要开发一套就够，缺点就是CSS比较重。下面是博客网站对不同设备适配后的结果，分别是iPhone5/SE,iphone6/7/8,iphone 6/7/8 p…

1.当上下相邻的两个块级元素相遇，上面的元素有下边距margin-bottom，下面的元素有上边距margin-top，则它们之间的垂直距离取两个值中的较大者。 这时候两个盒子之间的垂直距离不是30px，而是20px。 2.对于两个嵌套关系的块元素，如果父元素没有上内边距及边框…