HTML页面背景渐变

来源：互联网发布：日语有声翻译软件编辑：程序博客网时间：2024/05/05 02:34

设置HTML背景颜色渐变可以用很多方法

诸如

1.用PS画张1400*2000的渐变图片，在BODY中设置为背景图片

2.用JS写

3.用CSS样式

我这里介绍第3种，

-----------------------------直接贴出HTML代码-------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
body{filter:progid:DXImageTransform.Microsoft.gradient(
startcolorstr=#a2e06a,endcolorstr=#fafafa,gradientType=0);}
</style>
</head>
</head>

</body>
</html>

----------------------------------------------------------------------------------------

这是IE里滤镜的效果，因此次方法只适合IE浏览器或以IE内核为主的浏览器，并且版本要不低于6.0版本，这个本人没亲自测试过，仅当借鉴

startcolorstr=#a2e06a //开始颜色

endcolorstr=#fafafa //结束颜色

gradientType=0 //模式 1为从左到右渐变 0为从上到下渐变