社区
ASP
帖子详情
那为高手能给我介绍一下在css中怎么定义下拉菜单
gongyu
2006-05-26 11:41:26
那为高手能给我介绍一下在css中怎么定义下拉菜单,给我一段代码也行,谢谢!
...全文
142
6
打赏
收藏
那为高手能给我介绍一下在css中怎么定义下拉菜单
那为高手能给我介绍一下在css中怎么定义下拉菜单,给我一段代码也行,谢谢!
复制链接
扫一扫
分享
举报
写回复
配置赞助广告
用AI写文章
6 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
gongyu
2006-05-26
打赏
举报
回复
best_inh(一无所)
谢谢你,真的太感谢你了,^_^
gongyu
2006-05-26
打赏
举报
回复
^_^,是我,刘!!看我给你留言吧
162100
2006-05-26
打赏
举报
回复
自创的,自认为最简洁、兼容性最好的
送给你
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>导航条</title>
<style type="text/css">
<!--
body,td,th {
font-size: 12px;
}
.sol {
position:absolute;
left:10px;
top:0px;
}
a.menu {
float:left
width:60px;
height:17px;
line-height:17px;
float:left;
overflow:hidden;
color: #FFF;
text-align:center;
text-decoration:none;
background-color:#467EEF;
border:#FF0000 1px solid;
}
a.menu:hover {
color:#fff;
height:69px;
text-decoration:none;
}
-->
</style>
</head>
<body>
<div class="sol">
<a href="#" class="menu">导航条一<br>
<div onmouseover="this.style.backgroundColor='#C4D8FF'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='http://www.163.com';">网易</div>
<div onmouseover="this.style.backgroundColor='#C4D8FF'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='http://www.sina.com';">新浪</div>
<div onmouseover="this.style.backgroundColor='#C4D8FF'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='http://www.sohu.com';">搜狐</div>
</a>
<a href="#" class="menu">导航条二<br>
<div onmouseover="this.style.backgroundColor='#C4D8FF'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='http://www.csdn.net';">CSDN</div>
<div onmouseover="this.style.backgroundColor='#C4D8FF'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='http://www.china.com';">中华</div>
<div onmouseover="this.style.backgroundColor='#C4D8FF'" onmouseout="this.style.backgroundColor=''" onclick="window.location.href='http://www.tom.com';">TOM</div>
</a>
</div>
<br>
<br>
<br>
下面的内容
</body>
</html>
senvenliu
2006-05-26
打赏
举报
回复
小翁??
gongyu
2006-05-26
打赏
举报
回复
是做成导航条的那种,怎么在css中定义啊
underone
2006-05-26
打赏
举报
回复
<div id="menu_parent">Main Menu</div>
<div id="menu_child">
<a href="#">Item 1</a>
<a href="#">Item 2</a>
<a href="#">Item 3</a>
</div>
<script type="text/javascript">
at_attach("menu_parent", "menu_child", "hover", "y", "pointer");
</script>
如何使用
CSS
实现一个
下拉菜单
在现代网页设计
中
,
下拉菜单
(Dropdown Menu)是一个常见的UI组件,用于提供额外的导航选项或功能,而无需占用过多的屏幕空间。通过
CSS
,我们可以轻松地创建一个美观且功能齐全的
下拉菜单
。本文将详细
介绍
如何使用
CSS
来实现一个基本的
下拉菜单
,并通过多个示例帮助读者理解和应用这些技术。
下拉菜单
通常包含两个主要部分:首先,我们需要构建一个基本的
下拉菜单
结构: 代码解释 :包含整个导航菜单的标签。 :代表整个菜单列表。 :包含
下拉菜单
的菜单项。 :触发
下拉菜单
的链接。 :包含
下拉菜单
项的列表。 示例二:
HTML+
CSS
+JS 自
定义
下拉菜单
实现了一个
下拉菜单
的动画效果,包括一个主按钮和一个
下拉菜单
列表。点击主按钮会展开
下拉菜单
列表,同时箭头会旋转,列表项会逐渐显示出来。鼠标悬停在列表上时,会出现一个浮动图标。整个
下拉菜单
的样式比较简洁,使用了黑色和灰色的背景色,以及白色和淡灰色的文字和图标颜色。动画效果使用了
CSS
的过渡和变换属性。
[
CSS
]
CSS
下拉菜单
元素。使用容器元素 (如: ) 来创建
下拉菜单
的内容,并放在任何你想放的位置上。
下拉菜单
菜鸟教程 1菜鸟教程 2菜鸟教程 3
CSS
下拉菜单
使用
CSS
创建一个鼠标移动上去后显示
下拉菜单
的效果。
ASP
28,402
社区成员
356,940
社区内容
发帖
与我相关
我的任务
ASP
ASP即Active Server Pages,是Microsoft公司开发的服务器端脚本环境。
复制链接
扫一扫
分享
社区描述
ASP即Active Server Pages,是Microsoft公司开发的服务器端脚本环境。
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章