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>title>
<style type="text/css">
ul
{
list-style: none;
}
a
{
text-decoration: none;
}
.fist_menu
{
text-align: center;
}
.fist_menu > li
{
float: left;
width: 100px;
height: 20px;
border: 1px solid silver;
background-color: Yellow;
cursor: pointer;
}
.fist_menu > li > ul
{
margin: 0px;
border: 1px solid white;
display: none;
}
.fist_menu > li > ul > li
{
height: 20px;
background-color: Gray;
border: 1px solid white;
}
.fist_menu > li:hover > ul
{
display: block;
}
.thirdly_menu
{
margin-top: -20px;
margin-left: 98px;
display: none;
width: 105px;
}
.thirdly_menu>li
{
background-color: Red;
border: 1px solid white;
}
.fist_menu > li > ul > li:hover ul
{
display: block;
}
style>
head>
<body>
<div>
<ul class="fist_menu">
<li><a href="#">Aa>
<ul>
<li><a href="#">A1a>li>
<li><a href="#">A2a>li>
<li><a href="#">A3a>li>
ul>
li>
<li><a href="#">Ba>
<ul>
<li><a href="#">B1a>
<ul class="thirdly_menu">
<li><a href="#">B1_1a>li>
<li><a href="#">B1_2a>li>
<li><a href="#">B1_3a>li>
ul>
li>
<li><a href="#">B2a>
<ul class="thirdly_menu">
<li><a href="#">B2_1a>li>
<li><a href="#">B2_2a>li>
<li><a href="#">B2_3a>li>
ul>
li>
<li><a href="#">B3a>
<ul class="thirdly_menu">
<li><a href="#">B3_1a>li>
<li><a href="#">B3_2a>li>
<li><a href="#">B3_3a>li>
ul>
li>
ul>
li>
<li><a href="#">Ca>
<ul>
<li><a href="#">C1a>li>
<li><a href="#">C2a>li>
<li><a href="#">C3a>li>
ul>
li>
<li><a href="#">Da>
<ul>
<li><a href="#">D1a>li>
<li><a href="#">D2a>li>
<li><a href="#">D3a>li>
ul>
li>
<li><a href="#">Ea>
<ul>
<li><a href="#">E1a>li>
<li><a href="#">E2a>li>
<li><a href="#">E3a>li>
ul>
li>
ul>
div>
body>
html>
京公网安备 11010802041100号