兼容所有浏览器
<!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/htmlcharset=utf-8" />
<title>页签</title>
<style type="text/css">
body { margin:0padding:0font-size:12pxfont-family:Verdana, Geneva, sans-serif}
.tab_all { width:800pxheight:automargin:0 automargin-top:50px}
.tab_menu { width:800pxheight:30px}
.tab_menu ul{ list-style:nonemargin:0padding:0width:800pxheight:30px}
.tab_menu li{ width:100pxheight:30pxfloat:leftmargin-right:5pxcursor:pointercolor:#FFFfont-weight:boldtext-align:centerline-height:30px}
.tab_menu li:hover {width:100pxheight:30pxbackground-color:#F93float:leftmargin-right:5px}
.tab_menu_li1{ background-color:#F93}
.tab_menu_li2{background-color:#F00}
.tab_txt { width:798pxheight:500px background-color: #F93}
</style>
<script language="javascript" type="text/javascript">
function oc(ii)
{
var alldivTitle = document.getElementById("alltitle").getElementsByTagName("li")
var alldiv = document.getElementById("all").getElementsByTagName("div")
for (var i = 0i <alldiv.lengthi ++)
{
if ((i + 1) == parseInt(ii))
{
alldivTitle[i].className = "tab_menu_li1"
alldiv[i].style.display = "block"
}
else
{
alldivTitle[i].className = "tab_menu_li2"
alldiv[i].style.display = "none"
}
}
}
</script>
</head>
<body>
<div class="tab_all">
<div class="tab_menu">
<ul id="alltitle">
<li class="tab_menu_li1" onclick="oc(1)">1</li>
<li class="tab_menu_li2" onclick="oc(2)">2</li>
<li class="tab_menu_li2" onclick="oc(3)">3</li>
<li class="tab_menu_li2" onclick="oc(4)">4</li>
<li class="tab_menu_li2" onclick="oc(5)">5</li>
</ul>
</div>
<div id="all">
<div class="tab_txt" style="display:block">1111111111111111111111</div>
<div class="tab_txt" style="display:none">22222222222222222222222</div>
<div class="tab_txt" style="display:none">3333333333333333333333333</div>
<div class="tab_txt" style="display:none">44444444444444444444444444</div>
<div class="tab_txt" style="display:none">555555555555555555555555</div>
</div>
</div>
</body>
</html>
祝你成功!
就跟写body是一样的,下面这些写法都是全局的,也就是适用于所有标签。body{.......}
a{......}
input{......}