61,124
社区成员
发帖
与我相关
我的任务
分享导航名称居中问题，SOS！
<!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/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
/*全局样式*/
/*主导航菜单*/
#menu ul{
padding:0;
border:0;
list-style:none;
line-height:150%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
#nav li a span{
float:left;
padding:3px 14px 7px 70px;
line-height:14px;
font-size:14px;
font-weight:bold;
color:blue;
background-image:url(22.png);
}
#nav li .nav_on span{
background-position:right 100%;
color:#333333;
padding:3px 14px 7px 70px;
background-image:url(11.png);
}
/*子栏目*/
#menu_con{
text-align:left;
padding-left:10px;
clear:both;
background-color:#FFCCFF;
}
.STYLE2 {font-size: 12px}
.STYLE3 {font-size: 14px}
</style>
</head>
<body>
<script language="javascript" type="text/javascript">
function qiehuan(num) {
for (var id = 0; id <= 8; id++) {
if (id == num) {
document.getElementById("qh_con" + id).style.display = "block";
document.getElementById("mynav" + id).className = "nav_on";
}
else {
document.getElementById("qh_con" + id).style.display = "none";
document.getElementById("mynav" + id).className = "";
}
}
}
</script>
<table width="69%"style="margin-left:13%;margin-top:5%;"cellpadding="0"cellspacing="0">
<tr>
<td width="49" align="left" bgcolor="#DFE8F6">
<img src="1_110609090937_6.jpg"width="32"align="middle"/> ZenKla</td>
<td colspan="4" bgcolor="#DFE8F6" >admin |<a href="#" class="STYLE2">アカウント情報 </a><span class="STYLE2">|<a href="#" class="STYLE2">ログアウト</a></span></span>
</td>
<td width='208' bgcolor="#DFE8F6" align="right">YYYY/MM/DD hh:mm</td>
</tr>
<tr>
<td colspan="5" align="center" bgcolor="#DFE8F6" >
<div id=menu>
<ul id=nav>
<li><a href="#" onclick="javascript:qiehuan(0)" id="mynav0" class="nav_on"><spans>设计</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(1)" id="mynav1" class="nav_off"><span>收集</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(2)" id="mynav2" class="nav_off"><span>监视</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(3)" id="mynav3" class="nav_off"><span>检索</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(4)" id="mynav4" class="nav_off"><span>管理</span></a></li>
</ul>
</div>
</div> </td>
<td width='208' align="right" bgcolor="#DFE8F6"><a href="#"><span class="STYLE3" >発電量監視用Webサ</span>イト</a></td>
</tr>
<tr>
<td colspan="6" style="background-color:#FFCCFF" >
<div id=menu_con>
<div id=qh_con0 style="DISPLaY: block" >
<ul>
<span class="STYLE3">设计</span>
</ul>
</div>
<div id=qh_con1 style="DISPLaY: none"><ul>
<span class="STYLE3">收集</span>
</ul></div>
<div id=qh_con2 style="DISPLaY: none"><ul>
<span class="STYLE3">监视</span>
</ul></div>
<div id=qh_con3 style="DISPLaY: none"><ul>
<span class="STYLE3">检索</span>
</ul></div>
<div id=qh_con4 style="DISPLaY: none"><ul>
<span class="STYLE3">管理</span>
</ul></div>
</p>
</div>
</td>
</tr>
<tr>
<td colspan="6" align="center" bgcolor="#DFE8F6">
</td>
</tr>
</table>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
/*全局样式*/
/*主导航菜单*/
#menu ul{
padding:0;
border:0;
list-style:none;
line-height:150%;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
#nav li a span{
float:left;
padding:3px 14px 7px 70px;
line-height:14px;
font-size:14px;
font-weight:bold;
color:blue;
background-image:url(22.png);
}
#nav li .nav_on span{
background-position:right 100%;
color:#333333;
padding:3px 14px 7px 70px;
background-image:url(11.png);
}
/*子栏目*/
#menu_con{
text-align:left;
padding-left:10px;
clear:both;
background-color:#FFCCFF;
}
.STYLE2 {font-size: 12px}
.STYLE3 {font-size: 14px}
</style>
</head>
<body>
<script language="javascript" type="text/javascript">
function qiehuan(num) {
for (var id = 0; id <= 8; id++) {
if (id == num) {
document.getElementById("qh_con" + id).style.display = "block";
document.getElementById("mynav" + id).className = "nav_on";
}
else {
document.getElementById("qh_con" + id).style.display = "none";
document.getElementById("mynav" + id).className = "";
}
}
}
</script>
<table width="69%"style="margin-left:13%;margin-top:5%;"cellpadding="0"cellspacing="0">
<tr>
<td width="49" align="left" bgcolor="#DFE8F6">
<img src="1_110609090937_6.jpg"width="32"align="middle"/> ZenKla</td>
<td colspan="4" bgcolor="#DFE8F6" >admin |<a href="#" class="STYLE2">アカウント情報 </a><span class="STYLE2">|<a href="#" class="STYLE2">ログアウト</a></span></span>
</td>
<td width='208' bgcolor="#DFE8F6" align="right">YYYY/MM/DD hh:mm</td>
</tr>
<tr>
<td colspan="5" align="center" bgcolor="#DFE8F6" >
<div id=menu>
<ul id=nav>
<li><a href="#" onclick="javascript:qiehuan(0)" id="mynav0" class="nav_on"><spans>设计</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(1)" id="mynav1" class="nav_off"><span>收集</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(2)" id="mynav2" class="nav_off"><span>监视</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(3)" id="mynav3" class="nav_off"><span>检索</span></a></li>
<li><a href="#" onclick="javascript:qiehuan(4)" id="mynav4" class="nav_off"><span>管理</span></a></li>
</ul>
</div>
</div> </td>
<td width='208' align="right" bgcolor="#DFE8F6"><a href="#"><span class="STYLE3" >発電量監視用Webサ</span>イト</a></td>
</tr>
<tr>
<td colspan="6" style="background-color:#FFCCFF" >
<div id=menu_con>
<div id=qh_con0 style="DISPLaY: block" >
<ul>
<span class="STYLE3">设计</span>
</ul>
</div>
<div id=qh_con1 style="DISPLaY: none"><ul>
<span class="STYLE3">收集</span>
</ul></div>
<div id=qh_con2 style="DISPLaY: none"><ul>
<span class="STYLE3">监视</span>
</ul></div>
<div id=qh_con3 style="DISPLaY: none"><ul>
<span class="STYLE3">检索</span>
</ul></div>
<div id=qh_con4 style="DISPLaY: none"><ul>
<span class="STYLE3">管理</span>
</ul></div>
</p>
</div>
</td>
</tr>
<tr>
<td colspan="6" align="center" bgcolor="#DFE8F6">
</td>
</tr>
</table>
</body>
</html>
...全文
