移动适配rem em1em=16px(默认)等于字体(font-size)的大小特点:em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。rem与em类似,都是相对字体的大小,但是rem只与HTML跟标签字体的大小相关。媒体查询1.实现在不同宽度的设备中,网页元素尺寸等比缩放效果2.媒体查询能够检测视口的宽度,然后编写差异化的 CSS 样式 flexible.js核心原理就是根据不同的视口宽度给网页中html根节点设.
flex基本应用及注意事项 基本使用display:flex; //设置弹性容器,添加给父级元素//主轴对其方式justify-content:flex-start;依次实现效果如上//侧轴对齐方式align-items:以上代码均添加给父级容器。align-self: 控制某个弹性盒子在侧轴的对齐方式(添加到弹性盒子)此代码添加给子级盒子,控制子级单个盒子的对齐方式。伸缩比:使用flex属性修改弹性盒子伸缩比flex:值;取值范...
animation属性中的infinite和alternate要一起使用 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title...
伪元素before/after,hover等注意事项 伪元素before/after::before 在父类元素的最前添加一个伪元素::after 在父类元素的最前添加一个伪元素必须设置content属性才能生效 是行内元素 加宽高时最好设置为块级元素 display: block; 用两个::的原因兼容性 与伪类选择器区分开来所有孩子中第四个孩子元素且为i的,并不是i的第四个孩子元素li i:nth-child(4)::after {content: '\e665';}hoverhover左边是选