DIV+CSS创建三栏网页布局方法介绍

来源：互联网发布：淘宝退款原因其他编辑：程序博客网时间：2024/05/17 03:40

<html>
<head>
<meta http-equiv="Content-Type" content="text ml; charset=gb2312">
<TITLE>DIV+CSS创建三栏网页布局方法介绍</TITLE>
<style>
td{font-size:9pt; color:#333333;FONT-FAMILY: "宋体"}
body{font-size:9pt; color:#333333;FONT-FAMILY: "宋体"}
a:link{ color: #01499A; text-decoration: none }
a:visited{ color: #01499A; text-decoration: none }
a:active{ color: #cc0000; text-decoration: none }
a:hover{ color: #cc0000; text-decoration: none}
a.b:link{ color: #01499A; text-decoration: none ; font-size:14px}
a.b:visited{ color: #01499A; text-decoration: none ; font-size:14px}
a.b:active{ color: #cc0000; text-decoration: underline ; font-size:14px}
a.b:hover{ color: #cc0000; text-decoration: underline ; font-size:14px}
a.c:link { color: #01499a; text-decoration: none ; font-size:14px}
a.c:visited { color: #01499a; text-decoration: none ; font-size:14px}
a.c:active{ color: #cc0000; text-decoration: underline; font-size:14px}
a.c:hover{ color: #cc0000; text-decoration: underline; font-size:14px}
.text_body {
font-size:14px;
margin: 5px auto;
text-align: left;
width: 620px;
line-height:25px;
    word-break: break-all;
    word-warp: break-word
}
.xmenu td{
font-size:14px;
font-weight:700;
color:#fedbbf;
border:0px;
filter:blendtrans(duration=0.5);
cursor:hand;
text-align:center;
}
-->
</style>
<script language="javascript" type="text/javascript">
function attachXMenu(objid){
var tds=objid.getElementsByTagName('td');
for(var i=0;i<tds.length;i++){
  with(tds[i]){
   onmouseover=function(){
    with(this){
     filters[0].apply();
     style.background='url("over.gif")';
     style.color='#ffffff'; //文字颜色
     filters[0].play();
    }
   }
   onmouseout=function(){
    with(this){
     filters[0].apply();
     style.background='';
     style.color='#fedbbf'; //文字颜色
     filters[0].play();
    }
   }
  }
}
}
</script>
</head>
<body>
<table border="0" width="920" cellpadding="0" style="border-collapse: collapse" height="40">
  <tr>
   <td background="line.gif" height="40">
   <div align="center">
    <table border="0" width="900" cellpadding="0" style="border-collapse: collapse" height="30" id="xmenu0" class="xmenu">
     <tr>
      <a href="#"><td width="90" align="center">综合应用</td></a>
      <a href="#"><td width="90" align="center">菜单特效</td></a>
      <a href="#"><td width="90" align="center">状态拦类</td></a>
      <a href="#"><td width="90" align="center">文本操作</td></a>
      <a href="#"><td width="90" align="center">窗口页面</td></a>
      <a href="#"><td width="90" align="center">图形特效</td></a>
      <a href="#"><td width="90" align="center">鼠标特效</td></a>
      <a href="#"><td width="90" align="center">时间日期</td></a>
      <a href="#"><td width="90" align="center">警告对话</td></a>
      <a href="#"><td width="90" align="center">按钮特效</td></a>
     </tr>
    </table><script>attachXMenu(xmenu0); //在上面这个table结束的地方执行事件动作的绑定, 这里的这个xmenu0就是那个table的id</script>
   </div>
   </td>
  </tr>
</table>
</body>
< ml>