zoukankan
html css js c++ java
CSS菜单
<!
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
>
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=gb2312"
/>
<
title
>
CSS菜单--下拉菜单
</
title
>
<
style
>
body
{
}
{
background-color
:
white
;
font-size
:
12px
;
font-family
:
Arial, Helvetica, sans-serif
;
margin
:
0px
;
padding
:
0px
;
color
:
white
;
}
ul,li
{
}
{
margin
:
0px
;
padding
:
0px
;
}
li
{
}
{
display
:
inline
;
list-style
:
none
;
list-style-position
:
outside
;
text-align
:
center
;
font-weight
:
bold
;
float
:
left
;
}
a:link
{
}
{
color
:
#336601
;
text-decoration
:
none
;
float
:
left
;
width
:
100px
;
padding
:
3px 5px 0px 5px
;
}
a:visited
{
}
{
color
:
#336601
;
text-decoration
:
none
;
float
:
left
;
padding
:
3px 5px 0px 5px
;
width
:
100px
;
}
a:hover
{
}
{
color
:
white
;
float
:
left
;
padding
:
3px 3px 0px 20px
;
width
:
88px
;
text-decoration
:
none
;
background-color
:
#539D26
;
}
a:active
{
}
{
color
:
white
;
float
:
left
;
padding
:
3px 3px 0px 20px
;
width
:
88px
;
text-decoration
:
none
;
background-color
:
#BD06B4
;
}
#nav
{
}
{
width
:
600px
;
height
:
30px
;
border-bottom
:
0px
;
padding
:
0px 5px
;
position
:
absolute
;
z-index
:
1
;
}
.list
{
}
{
line-height
:
20px
;
text-align
:
left
;
padding
:
4px
;
font-weight
:
normal
;
}
.menu1
{
}
{
width
:
120px
;
height
:
auto
;
margin
:
6px 4px 0px 0px
;
border
:
1px solid #9CDD75
;
background-color
:
#F1FBEC
;
color
:
#336601
;
padding
:
6px 0px 0px 0px
;
cursor
:
hand
;
overflow-y
:
hidden
;
filter
:
Alpha(opacity=70)
;
-moz-opacity
:
0.7
;
}
.menu2
{
}
{
width
:
120px
;
height
:
18px
;
margin
:
6px 4px 0px 0px
;
background-color
:
#F5F5F5
;
color
:
#999999
;
border
:
1px solid #EEE8DD
;
padding
:
6px 0px 0px 0px
;
overflow-y
:
hidden
;
cursor
:
hand
;
}
</
style
>
</
head
>
<
body
>
<
div
id
="nav"
>
<
ul
>
<
li
class
="menu2"
onMouseOver
="this.className='menu1'"
onMouseOut
="this.className='menu2'"
>
我的
首页
<
div
class
="list"
>
<
a
href
="#"
>
我的CHINAY
</
a
><
br
/>
<
a
href
="#"
>
我的首页
</
a
><
br
/>
<
a
href
="#"
>
我的日志
</
a
><
br
/>
<
a
href
="#"
>
我的日志
</
a
><
br
/>
<
a
href
="#"
>
我的相册
</
a
><
br
/>
<
a
href
="#"
>
我的收藏
</
a
><
br
/>
</
div
>
</
li
>
<
li
class
="menu2"
onMouseOver
="this.className='menu1'"
onMouseOut
="this.className='menu2'"
>
社区
圈子
<
div
class
="list"
>
<
a
href
="#"
>
我的CHINAY
</
a
><
br
/>
<
a
href
="#"
>
我的首页
</
a
><
br
/>
<
a
href
="#"
>
我的日志
</
a
><
br
/>
<
a
href
="#"
>
我的相册
</
a
><
br
/>
<
a
href
="#"
>
我的收藏
</
a
><
br
/>
</
div
>
</
li
>
<
li
class
="menu2"
onMouseOver
="this.className='menu1'"
onMouseOut
="this.className='menu2'"
>
我的
短信
<
div
class
="list"
>
<
a
href
="#"
>
我的CHINAY
</
a
><
br
/>
<
a
href
="#"
>
我的相册
</
a
><
br
/>
<
a
href
="#"
>
我的收藏
</
a
><
br
/>
</
div
>
</
li
>
<
li
class
="menu2"
onMouseOver
="this.className='menu1'"
onMouseOut
="this.className='menu2'"
>
账户
管理
<
div
class
="list"
>
<
a
href
="#"
>
我的CHINAY
</
a
><
br
/>
<
a
href
="#"
>
我的首页
</
a
><
br
/>
<
a
href
="#"
>
我的日志
</
a
><
br
/>
<
a
href
="#"
>
我的相册
</
a
><
br
/>
<
a
href
="#"
>
我的收藏
</
a
><
br
/>
<
a
href
="#"
>
我的日志
</
a
><
br
/>
<
a
href
="#"
>
我的相册
</
a
><
br
/>
<
a
href
="#"
>
我的收藏
</
a
><
br
/>
</
div
>
</
li
>
</
ul
>
</
div
>
</
body
>
</
html
>
源:
http://www.becaused.com/article.asp?id=393
查看全文
相关阅读:
android测试 adb命令、Monkey命令
appium工作原理及启动方式
python中自动化测试框架unittest
python读取execl数据文件
LeetCode#110 Balanced Binary Tree
LeetCode#111 Minimum Depth of Binary Tree
LeetCode#112 Path Sum
数据链路层对应的子层
数据链路层设备
介质访问控制
原文地址:https://www.cnblogs.com/yiki/p/679924.html
最新文章
vs2019 c语言 配置连接mysql
label和input标签的羁绊
ubuntu c连接mysql
COMP9021--6.6
近日经验总结
Lecture 1
COMP9021——6.3
biological clock--class
biological clock
python模块安装
热门文章
文件操作
python--time
ubuntu18.04窗口截图和选区截图快捷键
解决ubuntu命令行中文乱码
编写函数返回二叉树的后序遍历
【牛客网】二维数组中的查找
PAT (Advanced Level) 1124~1127:1124模拟 1125优先队列 1126欧拉通路 1127中序后序求Z字形层序遍历
session 、cookie、token的区别
linux命令
web自动化测试
Copyright © 2011-2022 走看看