zoukankan
html css js c++ java
竖型下拉菜单
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
>
<
title
>
Horizontal Drop Down Menus
</
title
>
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=iso-8859-1"
/>
<
style
type
="text/css"
>
body
{
}
{
font
:
normal 12px verdana
;
}
ul
{
}
{
margin
:
0
;
padding
:
0
;
list-style
:
none
;
width
:
130px
;
/**/
/*
Width of Menu Items
*/
border-bottom
:
1px solid #ccc
;
}
ul li
{
}
{
position
:
relative
;
}
li ul
{
}
{
position
:
absolute
;
left
:
129px
;
/**/
/*
Set 1px less than menu width
*/
top
:
0
;
display
:
none
;
}
/**/
/*
Styles for Menu Items
*/
ul li a
{
}
{
display
:
block
;
text-decoration
:
none
;
color
:
#666
;
background
:
#fff
;
/**/
/*
IE6 Bug
*/
padding
:
5px
;
border
:
1px solid #ccc
;
border-bottom
:
0
;
}
/**/
/*
Fix IE. Hide from IE Mac \
*/
* html ul li
{
}
{
float
:
left
;
height
:
1%
;
}
* html ul li a
{
}
{
height
:
1%
;
}
/**/
/*
End
*/
ul li a:hover
{
}
{
color
:
#E2144A
;
background
:
#f9f9f9
;
}
/**/
/*
Hover Styles
*/
li ul li a
{
}
{
padding
:
2px 5px
;
}
/**/
/*
Sub Menu Styles
*/
li:hover ul, li.over ul
{
}
{
display
:
block
;
}
/**/
/*
The magic
*/
</
style
>
<
script
type
="text/javascript"
>
//
drop_down.js
startList
=
function
()
{
if
(document.all
&&
document.getElementById)
{
navRoot
=
document.getElementById(
"
nav
"
);
for
(i
=
0
; i
<
navRoot.childNodes.length; i
++
)
{
node
=
navRoot.childNodes[i];
if
(node.nodeName
==
"
LI
"
)
{
node.onmouseover
=
function
()
{
this
.className
+=
"
over
"
;
}
node.onmouseout
=
function
()
{
this
.className
=
this
.className.replace(
"
over
"
,
""
);
}
}
}
}
}
window.onload
=
startList;
</
script
>
</
head
>
<
body
>
<
ul
id
="nav"
>
<
li
><
a
href
="javascript:void(0);"
>
Home
</
a
></
li
>
<
li
><
a
href
="javascript:void(0);"
>
About
</
a
>
<
ul
>
<
li
><
a
href
="#"
>
History
</
a
></
li
>
<
li
><
a
href
="#"
>
Team
</
a
></
li
>
<
li
><
a
href
="#"
>
Offices
</
a
></
li
>
</
ul
>
</
li
>
<
li
><
a
href
="javascript:void(0);"
>
Services
</
a
>
<
ul
>
<
li
><
a
href
="#"
>
Web Design
</
a
></
li
>
<
li
><
a
href
="#"
>
Internet Marketing
</
a
></
li
>
<
li
><
a
href
="#"
>
Hosting
</
a
></
li
>
<
li
><
a
href
="#"
>
Domain Names
</
a
></
li
>
<
li
><
a
href
="#"
>
Broadband
</
a
></
li
>
</
ul
>
</
li
>
<
li
><
a
href
="javascript:void(0);"
>
Contact Us
</
a
>
<
ul
>
<
li
><
a
href
="#"
>
United Kingdom
</
a
></
li
>
<
li
><
a
href
="#"
>
France
</
a
></
li
>
<
li
><
a
href
="#"
>
USA
</
a
></
li
>
<
li
><
a
href
="#"
>
Australia
</
a
></
li
>
</
ul
>
</
li
>
</
ul
>
</
body
>
</
html
>
查看全文
相关阅读:
[React]核心概念
[算法]复杂度分析
[算法]移除指定元素&strSr()的实现
[算法]合并链表&删除数组重复项
php _weakup()反序列化漏洞
Java 注解详解
MyBatis入门
Spring 事务管理
Spring AOP
Spring JDBC
原文地址:https://www.cnblogs.com/studio313/p/647825.html
最新文章
开学第八周
开学第七周
第六周学习总结
4. Vulnerability Analysis & Exploitation
欢乐C++ —— 0. 大纲
快乐Linux —— 0. 简介
XSLT
XPATH Injection
BurpSuite 功能概览
NMAP 使用小技巧
热门文章
XSSI
jwt 安全
12. Mr robot 靶机
11. PwnLab init 靶机
10. Vulnix 靶机
[React]React-Redux用法
[React]Redux中间件与异步操作
[React]Redux初探
[React]Hook初探
[React]Context机制
Copyright © 2011-2022 走看看