国庆网页背景代码-首页国庆背景代码
这款国庆背景代码是一款仿各大门户网站的，如网易，163，新浪，sina,sohu等网站的60周年国庆背景代码给各位朋友提供了哦，如果喜欢可以来看看这款为国庆而改变网页北景的代码
- <style type="text/css">
- <!--
- body {
- margin-left: 0px;
- margin-top: 59px;
- margin-right: 0px;
- margin-bottom: 0px;
- background:url(http://www.kanxinyi.com/images/shanghai/zg60.jpg) no-repeat center top;
- }
- body,td,th {
- font-size: 12px;
- }
- .style1 {color: #FFFFFF}
- .STYLE2 {color: #666666; font-size: 12px;}
- .a1:link { color:#ffffff; TEXT-DECORATION: none }
- .a1:hover { color:#ffffff; TEXT-DECORATION: underline }
- .a1:visited { color:#ffffff; TEXT-DECORATION: none }
- .a2:link { color:#000000; TEXT-DECORATION: none }
- .a2:hover { color:#CC3333; TEXT-DECORATION: none }
- .a2:visited { color:#000000; TEXT-DECORATION: none }
- .a3:link { color:#666666; TEXT-DECORATION: none }
- .a3:hover { color:#666666; TEXT-DECORATION: underline }
- .a3:visited { color:#666666; TEXT-DECORATION: none }
- #scrollWrap {
- width:400px;
- height: 18px;
- overflow: hidden;
- }
- #scrollMsg {
- float: left;
- text-align: left;
- padding:0 0px;
- }
- #scrollMsg ul {
- margin:0;
- padding:0;
- }
- #scrollMsg li {
- font-size:12px;
- color:#FFFFFF;
- line-height: 18px;
- list-style:none;
- }
- .TabHZ ul{ padding-right:0px; padding-left:0px; padding-bottom:0px; margin:0px; list-style-type:none; height:21px;line-height:18px;background:url(images/09sy_new_dian.gif) repeat-x left bottom;}
- .TabHZ ul a,.TabHZ ul a:visited{text-decoration:none;}
- .TabHZ li{float:left;padding:3px 15px 3px;background:#939192;border:1px solid #D3D3D3;border-bottom:none;}
- .TabHZ li.cur{padding:3px 15px 3px;background:#BF0005;}
- .TabHZ li.cur a{text-decoration:none;}
- .TabHZ1 ul{ padding-right:0px; padding-left:0px; padding-bottom:0px; margin:0px; list-style-type:none; height:21px;line-height:18px;background:url(images/09sy_new_dian.gif) repeat-x left bottom;}
- .TabHZ1 ul a,.TabHZ1 ul a:visited{color:#ffffff;text-decoration:none;}
- .TabHZ1 li{float:left;margin-left:1px;padding:1px 5px 0;background:#939192;border:1px solid #D3D3D3;border-bottom:none;}
- .TabHZ1 li.cur{padding-bottom:1px;background:#BF0005;}
- .TabHZ1 li.cur a{text-decoration:none;}
- .input{
- background-color: #FFFFFF;
- border: 1px #dcdcdc solid;
- font-size:12px;
- }
- .STYLE4 {color: #333333}
- .STYLE5 {
- font-size: 12px;
- font-weight: bold;
- }
- .style11 {font-size: 12px}
- .Layer2 {
- position:absolute;
- width:457px;
- height:48px;
- z-index:1;
- left: 292px;
- top: 25px;
- }
- -->
- </style>
- 效果图片。
- 国庆网页北景代码二。
- <SCRIPT LANGUAGE="JavaScript">
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";
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);
}
}
</SCRIPT>
<body onLoad="fadeIn(16)">
背景二:
<!-- Begin
var Clrs = new Array(9);
Clrs[0] = 'ff0000';
Clrs[1] = '00ff00';
Clrs[2] = '000aff';
Clrs[3] = 'ff00ff';
Clrs[4] = 'ffa500';
Clrs[5] = 'ffff00';
Clrs[6] = '00ff00';
Clrs[7] = 'ffffff';
Clrs[8] = 'fffff0';
var sClrs = new Array(5);
sClrs[0] = 'ffa500';
sClrs[1] = '55ff66';
sClrs[2] = 'AC9DFC';
sClrs[3] = 'fff000';
sClrs[4] = 'fffff0';
var yBase;
var xBase;
var step;
var currStep = 0;
var Xpos = 1;
var Ypos = 1;
var initialStarColor = 'ffa000';
var Mtop = 250;
var Mleft = 250;
function Fireworks() {
if (document.all) {
yBase = window.document.body.offsetHeight / 3;
xBase = window.document.body.offsetWidth / 8;
}
else if (document.layers) {
yBase = window.innerHeight / 3;
xBase = window.innerWidth / 8;
}
if (document.all) {
step = 5;
for ( i = 0 ; i < starsDiv.all.length ; i++ ) {
for (ai = 0; ai < Clrs.length; ai++) {
var c = Math.round(Math.random()*[ai]);
}
if (currStep < 90)
starsDiv.all[i].style.background=initialStarColor;
if (currStep > 90)
starsDiv.all[i].style.background=Clrs[c];
starsDiv.all[i].style.top = Mtop + yBase*Math.sin((currStep+i*5)/3)*Math.sin(550+currStep/100)
starsDiv.all[i].style.left = Mleft + yBase*Math.cos((currStep+i*5)/3)*Math.sin(550+currStep/100)
}
}
else if (document.layers) {
step = 5;
for ( j = 0 ; j < 24 ; j++ ) { //number of NS layers!
var templayer = "a"+j;
for (ai = 0; ai < Clrs.length; ai++) {
var c = Math.round(Math.random()*[ai]);
}
if (currStep < 90)
document.layers[templayer].bgColor=initialStarColor;
if (currStep > 90)
document.layers[templayer].bgColor=Clrs[c];
document.layers[templayer].top = Mtop + yBase*Math.sin((currStep+j*5)/3)*Math.sin(550+currStep/100)
document.layers[templayer].left = Mleft + yBase*Math.cos((currStep+j*5)/3)*Math.sin(550+currStep/100)
}
}
currStep+= step;
T=setTimeout("Fireworks()",5);
if (currStep == 220) {
currStep = -10;
for (n = 0; n < sClrs.length; n++) {
var k = Math.round(Math.random()*n);
}
initialStarColor = sClrs[k];
if (document.all) {
Dtop = window.document.body.clientHeight - 250;
Dleft = xBase * 3.5;
Mtop = Math.round(Math.random()*Dtop);
Mleft = Math.round(Math.random()*Dleft);
document.all.starsDiv.style.top = Mtop+document.body.scrollTop;
document.all.starsDiv.style.left = Mleft+document.body.scrollLeft;
}
else if (document.layers) {
Dleft = window.innerWidth - 100;
Dtop = window.innerHeight - 100;
Mtop = Math.round(Math.random()*Dtop+window.pageYOffset);
Mleft = Math.round(Math.random()*Dleft+window.pageXOffset);
document.layers[templayer].top = Mtop;
document.layers[templayer].left = Mleft;
}
if ((Mtop < 20) || (Mleft < 20)) {
Mtop += 90;
Mleft += 90;
}
}
}
Fireworks();
// End -->
</script> - 再来一款最简单的确国庆背景代码,网站首页60周年国庆背景代码
<style>
body { background-image:url(http://bbs.menhutong.com.cn/attachments/month_0909/20090921_9e19ecaf3dda518df976EMvOMd01ZzG1.jpg); background-repeat:no-repeat; background-position: top center; padding-top:52px;}
.main01{clear:both;width:960px;margin:10px auto 0px auto;overflow:hidden;}
.main01 .left {float: left;width: 300px;}
</style>
补充：网页制作,设计基础
