CSS中的字体颜色可以根据不同的需求进行设置,这给我们的设计带来了不少的灵活性。通过color属性设置字体的颜色,为了让每一个字体的颜色都不同,我们可以借助CSS3的渐变属性。 p { backgro
CSS中的字体颜色可以根据不同的需求进行设置,这给我们的设计带来了不少的灵活性。
通过color
属性设置字体的颜色,为了让每一个字体的颜色都不同,我们可以借助CSS3的渐变属性。
p { background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
然后我们就可以看到一个颜色各异的字体文本了。
当然,我们也可以使用CSS3中的多背景图层功能来设置不同字体的颜色,下面是代码示例。
p { background-image: repeating-linear-gradient(-45deg, blue, blue 10px, pink 10px, pink 20px); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
最后,值得需要提醒的是,使用太多的不同颜色不同字体效果会给用户带来不好的体验,所以还是要谨慎使用。
粉丝
0
关注
0
收藏
0