Html5 表單
首先在html中
<title>鴨鴨鴨</title>
<link rel="stylesheet" type="text/css" href="css/demo.css"/>/* 設置超鏈接*/
</head>
<body>
<div class="bannana">
<h1>SYROS</h1>
<ul class="bannana_ul">
<li><a href="">HOME</a>
<ul class="HOME_ul">
<li><a href="">Home Default</a></li>
<li><a href="">Home Onepage</a></li>
<li><a href="">Home Business</a></li>
<li><a href="">Home Agency</a></li>
<li><a href="">Home Landing</a></li>
<li><a href="">Home Shop</a></li>
</ul>
</li>
.bannana {
width: 100%;
height: 150px;
color: white;
z-index: 100;
position: absolute;
}
.bannana h1 {
float: left;
margin-left: 50px;
}
.bannana_ul {
list-style: none;
float: left;
margin-top: 25px;
}
.bannana_ul li {
float: left;
padding: 5px 5px 5px 5px;
}
.bannana_ul li a {
color: white;
text-decoration: none;
font-size: 14px;
}
.bannana_ul li a:hover {
color: #FF0000;
}
.bannana li:hover .PAGES_ul {
display: block;
}
/*HOme 的CSS*/
.HOME_ul{
position: absolute;
list-style: none;
float: none;
margin-left: -40px;
display: none;
}
.HOME_ul li{
float: none;
background-color: white;
}
.HOME_ul li a{
color: black;
}
.HOME_ul li a:hover{
color: aquamarine;
}
.bannana li:hover .HOME_ul{
display: block;
}