手机站
网通分站
电信主站
密 码:
用户名:
当前位置 : 主页>网页制作>Dreamweaver>列表

Dreamweaver用表格巧妙制作导航条按钮

来源:互联网 作者:west263.com 时间:2008-02-23
西部数码-全国虚拟主机10强!40余项虚拟主机管理功能,全国领先!双线多线虚拟主机南北访问畅通无阻!免费赠送企业邮局,.CN域名,自助建站480元起,免费试用7天,满意再付款! P4主机租用799元/月.月付免压金!

  看到上面的导航条了吗?您能够点击一下看看他的效果,请注意,这可是用表格做出来的,您相信吗?其实代码很简单,现在让我们来看看该怎么做。

  1.首先创建一个1x6的表格,参数为:border=0 cellspacing=3 cellpadding=0;

  2.在这个表格的每个单元格内分别插入一个表格,宽度和高度设为100%;

  3.建立一个css样式.up和.down;代码如下:

  

  

  

  


  
<style>

  .up{

  border:4 outset royalblue;color:yellow;background:blue;cursor:hand

  }

  .down{

  border:4 inset royalblue;color:#33ff33;background:blue;cursor:hand

  }

  </style>


  4.对插入的表格调用样式和行为,代码如下:

  

  

  

  


  
class=up onMouseDown="className='down'" onMouseUp="className='up'" onMouseOut="className='up'" onclick=window.open("button.htm","_blank")


  注意:链接请用onclick,不要用href,因为后者访问后有虚线框,不美观。现在存盘看看效果吧

文章整理:西部数码--专业提供域名注册虚拟主机服务
http://www.west263.com
以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!