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

王朝html/css/js·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

方法一:

用图实现

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="http://www.webjx.com";

}

}

// Unhide -->

</SCRIPT>

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

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
 
© 2005- 王朝網路 版權所有 導航