易忘CSS记录
box-sizing: border-box;
transform: scale(0.8);
text-shadow: 0px 0px 2px black;
box-shadow: 0px 0px 2px black;
letter-spacing: 2px;
@media screen and (min-width: 600px){
.font{
color: red;
}
}
@media screen and (max-width: 600px){
.font{
color: blue;
}
}
justify-content: center;
justify-content: end;
justify-content: space-between;
justify-content: space-evenly;
justify-content: space-around;
word-break: break-all;
white-space:nowrap;
white-space:pre;
background-color: transparent;
border-radius: 5px;
background: rgba(80, 80, 80, 0.8); (opacity会使元素内文字也带有透明度)
overflow: scroll;
overflow: hidden;
position: fixed;
position: relative;
position: absolute;
@keyframes moveLeft{
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-65%, 0, 0);
transform: translate3d(-65%, 0, 0);
}
}
.animate_moveLeft {
-webkit-animation-name: moveLeft;
animation-name: moveLeft;
}
animation: name duration timing-function delay iteration-count direction fill-mode play-state;
animation-name 动画名
animation-iteration-count 播放次数 默认1 infinite无限次
animation-duration 动画周期时间
animation-timing-function 动画速度 linear匀速 ease 低-高-低 ease-in低速开始 ease-out低速结束
cubic-bezier(n,n,n,n) 在cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。
animation-delay 延迟播放
animation-direction 反向播放
animation-play-state 动画播放状态 paused暂停 running播放
animation-fill-mode 动画播放结束后的属性是播放之前还是播放之后的 forwards 播放后 backwards播放前 both都应用