-
:after与::after的区别？- 1⃣️它们都是伪元素，与
:hover/:active等伪类不一样 - 2⃣️
:before/:after伪元素是在CSS2中提出来的，可兼容到IE8 - 3⃣️
::before/::after是CSS3中到写法，为将伪类与伪元素区分开来，为了兼容性最好使用一个冒号的
- 1⃣️它们都是伪元素，与
-
cubic-bezier(n,n,n,n)贝塞尔曲线，决定变化的样式 -
justify-content: space-between;//均匀排列每个元素，首个元素放置于起点，末尾元素放置在终点 -
skewX(35deg);//如正方形变平行四边形 -
border-radius: 10% 30% 50% 70%;//圆角度数：左上 右上 右下 左下 -
filter:blur(5px);//过滤器，污点，像加滤镜(模糊) - sass(scss)可嵌套：sass不加中括号，分号；scss兼容css
- Babel语法：
babel src -d dist//将src中的JS文件转义到dist中 - box-shadow用法：可多层shadow，以下是取值个数不同所代表的不同值
例：offset-x offset-y blur-radius(阴影模糊半径) spread-radius(阴影扩展半径) color 60px -16px teal 10px 5px 5px black 2px 2px 2px 1px rgba(0,0,0,.2) box-shadow: inset 5em 1em gold; - transition用法：
property name duration timing function delay margin-right 4s ease-in-out 1s margin-right 4s -
!important用法：color: blue !important;//优先级最高（覆盖其它声明，少用） -
letter-spacing：明确文字的间距行为 -
filter``—过滤的用法：filter: blur(3px) brightness(.7) ...(更高级的属性)`//brightness-遮光（变黑或更亮） - 想隐藏元素可用：
display: none; - 取消
button被点击后的外边框蓝色效果：outline: none; - 添加下划线：
text-decoration: underline;//none去掉下划线 - flex布局：
justify-content(平行方向): space-around(平均分配)；align-items(垂直方向): space-between(两端对齐再平均)
- 文字两端对齐：
text-align: justify; flex-direction: colum(横排)/row(竖排)background-image: url('…');//注意路径-
flex-grow: 1(负值无效);//成长因子 input[type = text] {}-
pointer-events: none;表示鼠标事件“穿透”该元素，并且指定该元素“下面”的任何东西 -
filter: blur(1px);少加在原元素上，加在子元素或者伪元素上 -
background-size: cover;保证填满整个容器不拉扯图片 -
text-indent: 2em;首行缩进两字符 -
:root选择器—根组件，若不行则改为html - 若发现三个相同元素，没有水平对齐，加一个
vertical-align: middle/top/bottom都行，只要不是baseline; - 为什么都是
width: 50%;都三个元素，却能构成一行平均三等份？
由于没有设置flex-wrap: wrap;故这三个被挤在中间不换行 -
flex-shrink: 0;不缩，不换行 - 如何适配不同设备？由范围大到小：
phone(0-oo)>ipad(a-oo)>pc(b-oo)//a<b -
outerHTML输出HTML - 如果父元素高度变成
min-height，那么子元素都百分比（%）高度就失效了，因为此时父元素没有height，即height=0 - 使用ref去让JS添加属性
- 元素的
style只获取内联元素，不获取CSS元素，故用getBoundingClientRect() - 有时
margin-left: auto;会自动跑右边去
更新于2019-01-15-19:10，以上皆为日常笔记，如有问题还望大家多多指正！
