当我们在切图的时候,经常会碰见这样的 普通 的描边字,如果我们都切成图片将造成大量的图片素材,工作量大,加载速度慢,难维护。
经过反复实验,发现使用 text-shadow 的多重属性即可实现,多重属性主要用 ,(逗号) 来分隔,给元素可以设置多个不同参数的属性。
.text-shadow { color: #FFE339; text-shadow: 1px 0 0 #622E00, -1px 0 0 #622E00, 0 1px 0 #622E00, 0 -1px 0 #622E00; }
以上代码主要设置4个多重属性,然后分别让他们位于元素的上下左右,从而实现描边的效果。
注意:text-shadow的最后一个 ;(分号) 一定不能省略,CssGaga压缩时会删除最后一个属性的分号,导致页面出错,所以text-shadow不能放在最后!
就这样,普通的css就做出了普通的描边字!超简单的!
时间: 2024-11-01 18:38:30