返回顶部下载帮助
网站模板
模板颜色分类:
当前位置: html教程 >

css怎么制作颜色渐变效果

2015-09-20 文章标签: css 浏览次数:
纯色的背景和渐变的背景,一般访问者觉得渐变的效果更加美观一些,那么怎么用css设置渐变效果呢,实现方式有多样,常见的有制作一个渐变的图片,然后用背景图平铺的方式实现,或者用css其它属性。方法如下
 代码如下  

FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=''lightblue'', endColorStr=''#FFFFFF'', gradientType=''1'');

实例

 代码如下  

<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE>
BODY {
FONT-SIZE: 14px; 
MARGIN-LEFT: 60px
}

DIV {
height:25;
padding:3;
BORDER-RIGHT: lightblue 1px solid; 
BORDER-TOP: lightblue 1px solid; 
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=''lightblue'', endColorStr=''#FFFFFF'', gradientType=''1''); 
BORDER-LEFT: lightblue 1px solid; 
WIDTH: 200px; 
BORDER-BOTTOM: lightblue 1px solid
}

SPAN {
height:25;padding:3;
BORDER-RIGHT: lightblue 1px solid; 
BORDER-TOP: lightblue 1px solid; 
FILTER: progid:DXImageTransform.Microsoft.Gradient(startColorStr=''lightblue'', endColorStr=''#FFFFFF'', gradientType=''0''); 
MARGIN-LEFT: -25px; 
BORDER-LEFT: lightblue 1px solid; 
WIDTH: 225px; 
BORDER-BOTTOM: lightblue 1px solid
}
</STYLE>

<SPAN>个人简历:</SPAN>
<DIV>作品展示(时间倒序)</DIV>
<DIV>其他情况</DIV>
<SPAN>个人简历:</SPAN>
<DIV>作品展示(时间倒序)</DIV>
<DIV>其他情况</DIV>
<SPAN>个人简历:</SPAN>
<DIV>作品展示(时间倒序)</DIV>
<DIV>其他情况</DIV>


关于我们 - 联系我们 - 广告服务 - 友情链接 - 版权声明 - 手机版

免责声明:站内所有资源仅供学习与参考,请勿用于商业用途,否则产生的一切后果将由您自己承担!版权归原创者所有,如果侵犯了您的权益,请通知我们,我们会及时删除侵权内容。