700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > html渐变色CSS3 渐变 如何实现css3渐变色 css3渐变色怎么写

html渐变色CSS3 渐变 如何实现css3渐变色 css3渐变色怎么写

时间:2022-02-27 17:02:06

相关推荐

html渐变色CSS3 渐变 如何实现css3渐变色 css3渐变色怎么写

原标题:如何实现css3渐变色,css3渐变色怎么写

CSS3 渐变(gradients)可以让你在两个或多个指定的颜色之间显示平稳的过渡。

以前,你必须使用图像来实现这些效果。但是,通过使用 CSS3 渐变(gradients),你可以减少下载的事件和宽带的使用。此外,渐变效果的元素在放大时看起来效果更好,因为渐变(gradient)是由浏览器生成的。

因为浏览器的不同,所以你在代码前面需要加上浏览器的前缀: -webkit-、-moz- 或 -o-

Css3线性渐变:

background: linear-gradient(direction, color-stop1, color-stop2, ...); #jianbian{ background: -webkit-linear-gradient(red, blue); background: -o-linear-gradien t(red, blue); background: -moz-linear-gradient(red, blue); backgr ound: linear-gradient(red, blue); }

从左到右渐变的话就需要再加一个属性:

#jianbian{ background: -webkit-linear-gradient(left, red , blue); background: - o-linear-gradient(right, red, blue); background: -moz-linear-gradient(right, red , blue); background: linear-gradient(to right, red , blue); }

还有特别多的属性,小伙伴们可以自己去尝试一下!返回搜狐,查看更多

责任编辑:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。