设计、网站、推广
始于2004年
当前位置:首页 > 网站制作

制作网页中的渐变背景方法

发表日期:2009-3-27 作者来源:派谷网络 浏览次数:

方法一:
用图实现
1切一张1*760的渐变背景图
2在dw中添加做背景

方法二:
用css实现,代码如下:
〈html>
〈body style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#000000)">
〈center>
〈font size="+3">〈strong>网页背景色渐变〈br>
(从白色到黑色) 〈/strong>〈/font> 〈br>
〈br>
〈/center>
〈/body>
〈/html>

下面这个是斜角渐变啊
〈html>
〈body style="FILTER: Alpha( style=1,opacity=25,finishOpacity=100,startX=50,finishX= 100,startY=50,finishY=100); background-color: skyblue">
〈h1>背景渐变(左上至右下)〈/h1>
〈/body>
〈/html>
很COOL的哦!

方法三:
用javascript实现
〈SCRIPT LANGUAGE="javascript">

〈!-- Hide from old browsers
var Color= new Array(9);
Color[1] = "ff";
Color[2] = "ee";
Color[3] = "dd";
Color[4] = "cc";
Color[5] = "bb";
Color[6] = "aa";
Color[7] = "99";
Color[8] = "88";
Color[9] = "77";
Color[10] = "66";
Color[11] = "55";
Color[12] = "44";
Color[13] = "33";
Color[14] = "22";
Color[15] = "11";
Color[16] = "00";
/* Do not display text on a fading background. Instead, let it
fade in and out once or twice, then load a new page. */
function fadeIn(where) {
if (where >= 1) {
document.bgColor="#" + Color[where] +"0000";
where -= 1;
setTimeout("fadeIn("+where+")", 15);
} else {
setTimeout(’fadeOut(1)’, 15);
}
}
function fadeOut(where) {
if (where 〈=16) {
document.bgColor="#" + Color[where] +"0000";
where += 1;
setTimeout("fadeOut("+where+")", 15)
} else {
setTimeout("fadeIn(16)", 15);
// window.location.href="";
}
}
// Unhide -->
〈/SCRIPT>

〈body bgcolor="#fef4d9" onLoad="fadeIn(16)">

(注:在复制代码时请把“〈”改成英文下的“<”)

本文章系本站编辑转载,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请在30日内与本站联系,我们将在第一时间删除内容!

相关网站设计案例

相关推荐新闻
网站建设解决方案