css的一些功能代码:
背景颜色的设置:由三种颜色设置方法:1.英文单词 2.rgb设置3.#_等
background-color: #CDFFC5;
分别表示不同的属性:x y 模糊 外延(可选) 颜色
box-shadow: 2px 2px 2px 10px #ccc;
渐变色,颜色会逐渐发生变化,呈线性:
background: linear-gradient(90deg,red,yellow);
对div等标签变形:变形方式是缩放 当scale的值为1时不变 小于1缩小 大于1放大
transform: scale(1,2);
旋转:当移动鼠标时会使窗口选转
transform: rotate(45deg);
扭转:使窗口的角度改变
transform: skew(20deg);
渐变:给定的内容逐渐发生改变
transition: all linear 2s;
动画:使静态的变成动态 格式依次是动画名称 运动方式 运行时间 次数
animation: F43_run linear 2s infinite;
动画名为连接的代码,可以实现特定的功能,方式有以下两种:
@keyframes F43_run {
from{
/*background-color: #CDFFC5;*/
}
to{
/*background-color: yellow;*/
0%{
background-color: red;
}
20%{
background-color: orange;
}
40%{
background-color: yellow;
}
60%{
background-color: green;
}
80%{
background-color: deepskyblue;
}
100%{
background-color: purple;
}
}