本文介绍了如何利用CSS3渐变特性实现单一HTML元素上的多颜色展示。通过设置颜色参数和比例，可以在不使用图片的情况下创建出过渡效果。示例包括简单应用和:hover状态下的变化，提供了代码演示和效果截图。
发现一个比较好玩的东东，CSS3渐变，基本介绍和使用方式详见http://www.runoob.com/css3/css3-gradients.html。
原本是实现颜色的过渡效果，已替代图片的使用，但是配置合理的颜色参数，便可以实现单一元素的多颜色展示，上代码。
Demo1 简单的例子
html
<body>
<div class="demo"></div>
</body>
css
.demo {
height: 300px;
width: 300px;
margin: 0 auto;
border: 1px solid black;
background: linear-gradient(red, red 10%, blue 10%, blue);
最低0.47元/天 解锁文章
扫一扫
440
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
