一个网站能切换不同的CSS风格大家应该都了解，像众所周知的腾讯在今年改版时也增加了切换皮肤的功能。根据时间自动调整站点风格是不错的想法，这
种根据时间自动调整站点风格也不是什么新鲜事，记得好久以前也见过类似的文章或方法，只不过当时没有特别注意。下面说一下它们的实现方法，目前网上有这样
两种实现方法：
一、采用服务端的代码
PHP版本：
<link rel="stylesheet" type="text/css" href="
<?php
$hour = date(”H”);
if($hour < 12)
echo ‘morning.css’;
else if($hour < 17)
echo ‘day.css’;
else
echo ‘night.css’;
?>
" />
二、采用JavaScript代码
<script type="text/javascript">
<!–
function getCSS(){
datetoday = new Date();
timenow=datetoday.getTime();
datetoday.setTime(timenow);
thehour = datetoday.getHours();
if (thehour<12)
display = "morning.css";
else if (thehour<17)
display = "day.css";
else
display = "night.css";
//（…想要更多再加即可…）
var css = ‘<’;
css+=’link rel="stylesheet" href=’+display+’ //’;
css+=’>’;
document.write(css);
}
–>
</script>
考虑到客户端可能不支持或者禁止JavaScript，你需要设置一种默认的CSS。
转：http://www.sjzjwz.com/news/html/268.html
复制本代码后请新建你要的css文件，这里是red.css、green.css,yellow.css文件
<%@LANGUAGE="VBSCRIPT
" CODEPAGE="936"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd
">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>实现腾讯、雅虎切换皮肤效果，js加载不同css文件</title>
<link rel="alternate stylesheet" href="red.css" type="text/css" title="red" media="screen, projection"/>
<link rel="stylesheet" href="green.css" type="text/css" title="green" media="screen, projection"/>
<link rel="alternate stylesheet" href="yellow.css" type="text/css" title="yellow" media="screen, projection"/>
<script language="javascript" type="text/javascript">
<!--
function setActiveStyleSheet(title) {
var i, a, main;
if (title) {
for(i=0; (a = document.getElementsByTagName('link')[i]); i++) {
if(a.getAttribute('rel').indexOf('style') != -1 && a.getAttribute('title')) {
a.disabled = true;
if(a.getAttribute('title') == title) a.disabled = false;
}
}
}
}
function getActiveStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName('link')[i]); i++) {
if(a.getAttribute('rel').indexOf('style') != -1 &&
a.getAttribute('title') && !a.disabled) return
a.getAttribute('title');
}
return null;
}
//-->
</script>
</head>
<body>
<a href="javascript :void()" onclick="setActiveStyleSheet('red');
return false;" title="红色样式"><img src="theme2.gif"
alt="hong"></a>
<a href="javascript :void()" onclick="setActiveStyleSheet('green');
return false;" title="绿色样式"><img src="theme3.gif" alt="lv"
width="16" height="16"></a>
<a href="javascript :void()" onclick="setActiveStyleSheet('yellow');
return false;" title="黄色样式"><img src="theme4.gif" alt="huang"
width="16" height="16"></a>
<a href="javascript :void()" onclick="setActiveStyleSheet('none');
return false;" title="没有样式"><img src="theme1.gif" alt="wu"
width="16" height="16"></a>
</body>
</html>
转：http://hi.baidu.com/jinxiudesign/blog/item/972980c47980a2ce39db49c2.html