CSS常见知识点

``` display: flex; flex-direction: column; justify-content: space-around; ```

一、字体小于12px的解决方案 常用的方法是利用 transform: scale(0.5)。 使用方法有两种： 将字体单独放在一个盒子内，利用 transform: scale 缩小字体。Eg：把红

问题 　　1px 问题指的是：在一些 Retina 屏幕 的机型上，移动端页面的 1px 会变得很粗，呈现出不止 1px 的效果。 原因 　　原因很简单：CSS 中的 1px 并不能和当前显示设备上的

Flex 是 FlexibleBox 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。行内元素也可以使用 Flex 布局。 注意，设为 Flex 布

一、水平居中（要求：里外容器宽度都不一定，里面容器宽度自适应内容宽） （1）table + margin 优点：不需要设置父级样式；兼容性好，IE8 兼容，将该元素<div>改成<table>可兼容

常见的CSS布局单位有： 1. 像素（px） 2. 百分比（%） 3. em和rem 4. vw/vh px、em、rem的区别及使用场景

属性 描述 static 默认值，没有定位，元素出现在正常的文档流中，会忽略 top, bottom, left, right 或者 z-index 声明，块级元素从上往下纵向排布，⾏级元素从左向右排

1. 新增选择器 属性选择器 结构伪类选择器 伪元素选择器 2. 转换：transform 2D转换： 位移：transform：translate（100px，100px） 缩放：transform

隐藏元素的方法 1. display：none 渲染树不会包含该渲染对象，因此该元素不会在页面中占据位置 2. visibility：hidden 元素在页面中仍占据空间 3. opacity: 0

属性值 作用 none 元素不显示，并且会从文档流中移除 block 元素显示/块类型。默认宽度为父元素宽度，可设置宽高，换行显示 inline 行内元素类型。默认宽度为内容宽度，不可设置宽高，同行显

一、选择器 1、基础选择器 选择器 示例 实例说明 通配符选择器 * 选择所有元素 标签/元素选择器 div 选择所有<div>元素 类选择器 .box 选择所有class="box"的元素 id选择