css教程实现div背景色渐变色代码分享
发布时间:2013-12-27 14:48:20 作者:佚名 我要评论
一个简单div+css背景渐变色代码,大家参考使用吧
效果图:
复制代码
代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
<html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>">
<head>
<title>CSS使背景颜色渐变--柯乐义</title>
<style type="text/css">
.jb_keleyi_com{
height: 300px;
width:100px;
margin:0px auto;
background-image: -moz-linear-gradient(top, #00FF00, #FF0000); /*火狐*/
background: -o-linear-gradient(top, #00FF00 0%,red 100%);/*Opera*/
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #00FF00), color-stop(1,#FF0000)); /*Chrome*/
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FF00', endColorstr='#FF0000', GradientType='0'); /*IE*/
}
</style></p> <p></head>
<body>
用CSS是div颜色渐变
</p> <p><div class="jb_keleyi_com">从绿到红
keleyi.com</div>
</body>
</html>
相关文章
- 这篇文章主要介绍了css 进度条的文字根据进度渐变的示例代码,介绍了进度条里面的文字需要根据进度的长度而变化,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一2018-01-09
- 下面小编就为大家带来一篇css渐变色彩 省略标记 嵌入字体 文本阴影全面了解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧2016-08-05
- 这篇文章主要以模拟渐变色条实例,针对CSS3 HSLA色彩模式进行介绍,使用HSLA色彩模式,可以设计不同的透明效果,感兴趣的小伙伴们可以参考一下2016-04-26
- 多组div排列着圈子,利用css的hover属性产生色层渐变,只要拷贝一段很简单的html和css就可以实现2013-12-18
- 本示例代码就是上面是红色,下面是黑色,由上到下渐变色的可以看下效果图,感兴趣的朋友可以参考下哈2013-06-18
- 这篇文章主要介绍了CSS Tips:段落每行渐变色文本效果的实现方法,需要的朋友可以参考下2018-03-07
最新评论