二级横向菜单 - Rebecca - ITeye博客

`

rebecca

浏览: 314940 次
性别:
来自: 北京

最近访客更多访客>>

kxlele

莫世_abc

Linevers

jameszhangjp

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

spring_springmvc：可以参考最新的文档：如何在eclipse jee中检出项目并转 ...
Eclipse更改默认字符集设置UTF-8
u011344897：谢谢了
二级树形菜单
tywo45：博主，您好！请问有没有办法在切图生成html后，让图片全屏。
PS切图相关技巧
rebecca： rebecca 写道明白了，是对双引号的那为啥"ty ...
解析JS的转义 \ 字符
rebecca：明白了，是对双引号的
解析JS的转义 \ 字符

二级横向菜单

博客分类：

HTML和CSS
JavaScript

JavaScript XHTML Web CSS

阅读更多

二级横向菜单

html如下：


<body>
<ul id="nav">
	<li><a href="#">我的资料</a>
		<ul class="nav2">
			<li><a href="#">头像更新</a></li>
			<li><a href="#">基本信息</a></li>
		</ul>
	</li>
	<li><a href="#">我的相册</a>
		<ul class="nav2">
			<li><a href="#">我的颜色</a></li>
			<li><a href="#">欢乐谷之行</a></li>
			<li><a href="#">2011足迹</a></li>
                        <li><a href="#">八月十五</a></li>
                        <li><a href="#">同学聚会</a></li>
		</ul>
	</li>
	<li><a href="#">我的通讯录</a>
		<ul class="nav2">
			<li><a href="#">同事们</a></li>
			<li><a href="#">大学同学</a></li>
			<li><a href="#">高中同学</a></li>
			<li><a href="#">小学同学</a></li>
			<li><a href="#">其他</a></li>
		</ul>
	</li>
	<li><a href="#">我的WIKI</a>
		<ul class="nav2">
			<li><a href="#">9月</a></li>
			<li><a href="#">8月</a></li>
			<li><a href="#">7月</a></li>
			<li><a href="#">更多</a></li>
			
		</ul>
	</li>

        <li><a href="#">我的卡卡淘</a>
		<ul class="nav2">
			<li><a href="#">最新日志</a></li>
			<li><a href="#">成长篇</a></li>
			<li><a href="#">工作进度</a></li>
		
		</ul>
	</li>
</ul>
</body>

继续学习中ing!!!

demo.rar (1.2 KB)
下载次数: 12

查看图片附件

分享到：

offsetLeft你理解了吗？ | document.all Firefox不支持

2011-09-16 16:41
浏览 1793
评论(0)
分类:Web前端
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

横向二级菜单: 在网页设计中，横向二级菜单是一种常见的导航结构，它能够帮助用户更有效地浏览网站内容，尤其是在网站层次结构较深时。本项目通过结合HTML的`<div>`元素、CSS样式和JavaScript脚本来实现这一功能。下面我们将详细...

js实现的二级横向菜单条实例: 1. JS实现二级横向菜单条的核心原理： JavaScript（JS）是网页开发中常用的编程语言，用于实现网页的动态效果和用户交互。二级横向菜单条是一种常见的网页导航形式，通过JS可以为菜单条添加交互功能，使其在用户...

二级横向展开菜单网页特效: 在网页设计中，二级横向展开菜单是一种常见的交互效果，它能有效地组织和展示网站的层级结构，提升用户体验。这种特效通常应用于导航栏，使用户能够快速访问子页面或子类别，而不必滚动或点击多个链接。下面将详细...

css+js漂亮二级横向导航菜单-大全: 本文将深入探讨如何使用CSS（层叠样式表）和JavaScript技术来创建一款既美观又实用的二级横向导航菜单，主要关注"css+js漂亮蓝色二级横向导航菜单-大全"这一主题。首先，我们来看CSS在构建导航菜单中的作用。CSS...

JavaScript实现的3级横向导航菜单源码: 本篇将详细介绍如何使用JavaScript实现一个三级横向导航菜单。首先，我们需要理解基本的HTML结构。一个简单的导航菜单通常由`<ul>`（无序列表）和`<li>`（列表项）元素组成。对于多级菜单，我们可以嵌套`<ul>`和`...

横向二级导航菜单css: 横向二级导航的基于css菜单，可以把最后的float改成none,形成二级横向的菜单。

js实现横向弹出二级菜单: "js实现横向弹出二级菜单"是一种常见的交互设计技术，尤其适用于英文网站，因为英文单词通常较长，横向展示能更有效地利用空间，提供清晰的视觉层次。这个技术的核心是利用JavaScript语言来动态控制菜单的显示与隐藏...

jquery蓝色圆角横向二级导航菜单代码: 【jQuery蓝色圆角横向二级导航菜单代码】是一个用于创建具有美观设计和交互功能的网站导航栏的实现。这个代码利用了jQuery库的强大功能，结合HTML、CSS和JavaScript，为用户提供了一个直观且易于操作的二级菜单。...

jscss横向二级菜单: 一个基本的横向菜单通常由`<ul>`（无序列表）元素和`<li>`（列表项）元素组成，其中`<li>`元素内嵌套着链接`<a>`。对于二级菜单，我们将在一级菜单的`<li>`元素内部再嵌套一个`<ul>`，以此来实现子菜单的效果。 CSS...

JS二级横向下拉菜单: 在网页设计中，二级横向下拉菜单是常见的导航元素，它能够帮助用户更有效地浏览网站结构。这个项目是基于jQuery库实现的，jQuery是一个强大的JavaScript库，简化了DOM操作、事件处理和动画制作等任务。 jQuery库的...

JS横向二级导航菜单: 【JS横向二级导航菜单】是一种常见的网页交互设计，主要用于网站的顶部或侧边栏，提供主分类和子分类的层次结构，便于用户快速浏览和访问网站内容。在本项目中，我们将探讨如何利用JavaScript（JS）和CSS来实现这样...

Android实现横向二级菜单: 本教程将详细介绍如何在Android平台上实现一个横向二级菜单，这种菜单通常用于提供更精细的导航选项，提升用户体验。横向二级菜单在许多应用程序中都有应用，其美观的设计能吸引用户的眼球。实现横向二级菜单主要...

css+js打造网上经典蓝色二级横向滑动导航菜单代码: "CSS+JS打造网上经典蓝色二级横向滑动导航菜单代码"是一个实用的资源，旨在帮助开发者创建具有专业外观且功能完善的二级横向滑动菜单。下面我们将深入探讨这个主题，解析其中涉及的关键知识点。 1. **CSS（层叠样式...

巧克力jQuery横向二级滑动导航菜单源码，过度平滑，兼容主流浏览器: 这个“巧克力”导航菜单实现了横向滑动的二级菜单，当用户悬停在一级菜单项上时，二级菜单会平滑地滑出，为用户提供清晰的导航结构。平滑过渡效果是用户体验设计的关键元素之一，它能让用户在浏览网站时感到舒适和...

jQuery滑动横向二级导航菜单.zip: 本项目“jQuery滑动横向二级导航菜单”聚焦于创建一个动态且响应式的二级菜单，利用jQuery库的动画效果，提升用户体验。下面将详细阐述这个项目所涉及的核心知识点。 1. **jQuery库**：jQuery是一个广泛使用的...

很好看的二级横向导航菜单: 标题中的“很好看的二级横向导航菜单”是指一种在网页设计中常见的交互元素，它用于组织和展示网站的层级结构，使用户能便捷地访问不同级别的页面。这种类型的导航菜单通常出现在网页顶部，以水平布局展示一级菜单项...

Global site tag (gtag.js) - Google Analytics