CSS

1.radial-gradient() 函数创建一个<image>，用来展示由原点（渐变中心）辐射开的颜色渐变。这个方法得到的是一个CSS<gradient>数据类型的对象。

background: radial-gradient(#222, #fff);默认椭圆，默认从中心点向外辐射，颜色从#222--->#fff。

 

2. overflow,overflow 属性规定当内容溢出元素框时发生的事情。 overflow:visible,默认值，内容不会被修剪，会呈现在元素框之外；

overflow:hidden，内容会被修剪，并且其余内容是不可见的；overflow:scroll，内容会被修剪，但是浏览器会显示滚动条一遍查看其余内容；overflow:auto，如果内容被修剪，则浏览器会显示滚动条以便查看其余内容；overflow:inherit,规定应该从父元素继承overflow属性的值。

3.box-sizing,content-box:默认值，标准盒子模型，width,height只包括内容的宽和高，不包括边框，内边距，外边距；

　　　　　　border-box:高度和宽度包括内容，内边距和边框，但不包括外边距。

4.animation，设置留个动画属性，

• animation-name  规定需要绑定到选择器的keyframe名称；
• animation-duration　　规定完成动画所花费的时间，以秒或毫秒计；
• animation-timing-function　　动画的速度曲线；cubic-bezier(n,n,n,n)
• animation-delay　　动画开始之前的延迟；
• animation-iteration-count　　动画应该播放的次数；infinite无限次
• animation-direction       是否用该轮流反向播放动画。

5.transform-origin,设置旋转元素的基点位置，transform-origin:20%,40%;

　　animation-delay:-20ms设置动画延迟；

　　:nth-child()父元素的第几个子元素；

　　hsl(H,S,L)：H，色调取值（0-360）,S,饱和度,取值（0.0%-100.0%）L，亮度，取值(0.0%-100.0%)。通过对色相(H)、饱和度(S)、明度(L)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色.

　　transform:元素旋转方式translate,scale,rotate,skew.

 

 

https://codepen.io/jackrugile/full/JddmaX 项目地址。

转载于:https://www.cnblogs.com/wwkissocool/p/10766324.html