最近在做自己的网站漫岛网的时候,用到了两个CSS美化效果,为了防止遗忘,记录一下!
第一个是文字选中效果,这个可能很少有人注意过。一般网站默认的都是蓝色背景白色字体代表文字被选中,效果如下:
但是我们可以小小的改变一下配色,虽然只是微小的一点改动,但是效果却很好呢!
/*文字选中效果*/*::selection {background-color: palevioletred;color: white;}*::-moz-selection {background-color: palevioletred;color: white;}*::-webkit-selection {background-color: palevioletred;color: white}
另外一个就是文字的闪烁效果了,这个主要是利用C3的动画实现的,通过控制透明度达到这个闪烁效果,用在某些特定场景下是很不错的。
效果图:
CSS代码如下:
@-webkit-keyframes shake {0% {opacity: 0.8;}50% {opacity: 0.4;}100% {opacity: 0.8;}}@keyframes shake {0% {opacity: 0.8;}50% {opacity: 0.4;}100% {opacity: 0.8;}}.shake {-webkit-animation: shake 2.2s infinite;animation: shake 2.2s infinite;}
没事去我的网站看看,现在连咸鱼都缺!