教程：CSS高级技巧之滑动门技术

• 　　滑动门(Sliding Doors)
  
  　　还是决定把滑动门单独提作一种单独的技术.
  
  　　它是CSS引入的一项用来创造漂亮且实用的界面的新技术, 它使用简单, 我们只需要使用两张单独的背景图片, 就可以实现.
  
  
  
  　　滑动门一般用做网站Tab导航, 根据Tab中内容的长短自动缩放Tab的效果.
  
  
  
  　　前面所述的圆角矩形只是它的一种实现方式而已. 真正的滑动门只需要2组标签就可以完成:
  
  　　HTML代码如下:
  
  　　＜ul>
  
  　　 ＜li>＜a href=http://www.hackhome.com title="">网侠＜/a>＜/li>
  
  　　＜/ul>
  
  　　CSS代码大致如下:
  
  　#header li {
  float:left;
  background:url("left_both.gif")no-repeat left top;
  margin:0;
  padding:0 0 0 9px;
  border-bottom:1px solid #765;
  }
  #header a {
  float:left;
  display:block;
  background:url("right_both.gif")no-repeat right top;
  padding:5px 15px 4px 6px;
  text-decoration:none;
  font-weight:bold;
  color:#765;
  }
  
  
  

  （出处：http://www.hackhome.com/）

• 复制本页网址和标题，发送给你QQ/Msn的好友一起分享
  
  
• 教程：CSS高级技巧之滑动门技术 相关文章：
• ·photoshop换脸技术
• ·照片处理：Photoshop人物照片换头术
• ·游戏外挂设计技术探讨
• ·你不可不知的五大赚钱术！
• ·网络术语解析-ICS
• ·奥妮 战术指引 - 游戏攻略
• ·深度技术 GHOSTXP V6.0装机个人版
• ·QQ技术攻略-原来隐藏着这么多秘密
• ·MPLS VPN技术白皮书
• ·水浒Q传 术士技能升级所需点数
• 教程：CSS高级技巧之滑动门技术 相关软件
• ·火影忍者-忍术全开
• ·死灵术士之黑暗陷阱
• ·钢之炼金术师：迷走的轮舞曲
• ·房术秘笈
• ·魔法师传奇2之魔法艺术
• ·人体艺术浏览器 V3.2 特别版
• ·全国专业技术人员计算机应用能力考试模拟 V2.1
• ·vc++技术内幕第四版
• ·工程施工安全技术交底资料库 V05.15.08
• ·魔术情书V8.31

上一篇:看今朝：Excel数据表格的分分合合

下一篇:用路由器防止DoS拒绝服务疯狂攻击

• 特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
• 者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
• 载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

精品推荐

热点TOP10

特别推荐