优内建站网,专业建站,企业建站,免费建站,智能建站,个人建站!
主营企业建站,seo优化,手机网站,微信网站开发等业务!>> 繁体中文
用户名: 密 码: 验证码:    
企业建站,专业建站,模板建站,智能建站
 您现在的位置:首页 >> DIV+CSS视频 >> 详细内容>>        【字体:  】【颜色: 绿

用CSS制作漂亮的菜单- CSS/DIV布局专题讲解 - 第5课

在百度搜索关于“用CSS制作漂亮的菜单- CSS/DIV布局专题讲解 - 第5课”的内容

在谷歌搜索关于“用CSS制作漂亮的菜单- CSS/DIV布局专题讲解 - 第5课”的内容

买空间、服务器就上威客主机网(VK163.COM) 虚拟主机评测+IDC导航=威客主机之家 标志设计
[内容提要] 本节课时长10分46秒,下载文件9.98兆字节。下载的视频文件为FLV格式,推荐使用“RivaFlvPlayer”软件播放,点击这里下载。作为一个成功的网站,导航菜单是永远不可缺少的。导航菜单的样式风格往往也决定了整个网站的样式风格,因此很多设计者都会投入很多时间和精力来...

作者: 优内科技  来源: 优内科技  驻站日期:2008/11/27 【 加入收藏 】 【 打印此页 】 【 关闭

本节课时长10分46秒,下载文件9.98兆字节。下载的视频文件为FLV格式,推荐使用“Riva Flv Player”软件播放,点击这里下载

作为一个成功的网站,导航菜单是永远不可缺少的。导航菜单的样式风格往往也决定了整个网站的样式风格,因此很多设计者都会投入很多时间和精力来制作各式各样的导航条,从而体现网站的整体构架。本课围绕菜单的制作,介绍相关的项目列表、菜单变幻、导航栏等的内容。

1. 项目列表

传统的HTML语言提供了项目列表的基本功能,包括顺序式列表的 ol 标记,无顺序列表 ul 标记等等。当引入CSS后,项目列表被赋予了很多新的属性,甚至超越了最初设计时它的功能。我们在这里主要围绕项目列表的基本CSS属性进行相关介绍,包括项目列表的编号、缩进、位置等等。希望大家能够掌握以下几个方面的内容:

  • 列表的符号
  • 图片符号

2. 无需表格的菜单

当项目列表的项目符号可以通过list-style-type设置为none时,制作各式各样的菜单、导航条成了项目列表的最大用处之一,通过各种CSS属性变幻可以达到很多意想不到的导航效果。首先看一个实例,其效果如图所示。

3. 菜单的横竖转换

导航条不光是竖直排列,很多时候要求页面的菜单能够水平方向显示。通过CSS属性的控制,可以使项目列表的导航条轻松的实现横竖转换,该例效果如图所示。

 

4. 菜单实例一:百度导航条

打开搜索引擎百度的网站,可以看到logo下方的水平导航条。利用本课前面几节所介绍的内容和方法,便可以轻松实现该导航条。我们在这里便通过简单的制作,模拟该效果。

 

5. 菜单实例二:流行的Tab菜单

Tab风格的菜单导航一直受到广大网站的青睐,网上随处可见各式各样的Tab菜单,图中显示的就是一个Tab菜单。我们在这里通过对导航菜单CSS属性的进一步控制,实现Tab菜单的效果。

 

添加到QQ书签 百度收藏 订阅到抓虾 添加到鲜果  新浪ViVi  365Key网摘  天极网摘  我摘  和讯网摘  yahoo  收藏到收客网  Digbuzz我挖网  添加到饭否  挖客  添加到google  

   【回到顶部】 【返回文章列表】 编辑:优内科技
⊕ 上一篇:CSS滤镜的应用 - CSS/DIV布局专题讲解 - 第6课
⊕ 下一篇:设置页面和浏览器的元素 - CSS/DIV布局专题 - 第4课
  相关新闻
返回首页 | 设为首页 | 添加收藏 | 关于我们 | 联系我们 | 企业文化 | 合作伙伴 | 诚聘英才 | 网站报价 | 企业资质 | 网站地图
邮箱登陆 E- mail:master@cck5.com 点击这里给我发消息 客服专员 QQ:310203268 点击这里给我发消息 技术咨询 QQ:22071287点击这里给我发消息 代理备案 QQ:529631515
丰富的网站建设经验,专业提供网站建设、网站制作、网页设计服务,专业设计,真诚服务,不满意不收费!
Copyright 2008 - 2025 cck5 Inc. All Rights Reserved 优内建站网络科技公司
本站部分资源来自网络,如有侵犯您的版权,请告之,我们将即刻删除!QQ:310203268
主要业务:网站建设企业建站专业建站智能建站SEO优化微信建站手机建站
本站ICP备案号:浙ICP备11019299号 中国电信增值ICP经营许可证
不良信息举报中心 江西网警 信息产业部门备案 企业法人营业执照
 
扫优内微信二维码
“码”上有惊喜