CSS 全局修改滚动条样式
::-webkit-scrollbar {
/*滚动条整体样式*/
width : 4px; /*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
border-radius: 4px;
/*box-shadow : inset 0 0 2px rgba(0, 0, 0, 0.2);*/ 这个阴影可以要也可以不要,反正我是没用
background : #dee3eb;
}
::-webkit-scrollbar-track {
/*滚动条里面轨道*/
/*box-shadow : inset 0 0 2px rgba(0, 0, 0, 0.2);*/
border-radius: 4px;
background : #f9f9f9;
}
CSS 信封边框样式
效果:
@keyframes ants {
to {
background-position: 100%;
}
}
.demo {
display: block;
margin: 200px auto;
width: 300px;
height: 200px;
border: 4px solid transparent;
background: linear-gradient(white, white) padding-box,
repeating-linear-gradient(-45deg, rgba(119, 37, 8, 1) 0, rgba(119, 37, 8, 1) 20%, transparent 0, transparent 25%, rgba(201, 181, 148, 1) 0, rgba(201, 181, 148, 1) 44%, transparent 0, transparent 50%) 0/40px 40px;
animation: ants 12s linear infinite;
}