<!DOCTYPE?html>
<html>
<head>
????<title>選項(xiàng)卡</title>
????<meta?charset="utf-8">
????<style?type="text/css">
????*{
????????padding:?0;
????????margin:?0;
????}
????ul{
?
????????list-style:?none;
????????border:1px?solid?black;
????????width:?80px;
????????height:?120px;
????????margin-left:20px;
????????margin-top:?40px;?
????????//display:?block;
????}
????li{
????????height:?30px;
????????line-height:?30px;
????????text-align:?center;
???????z-index:?3;
?
????}??
????a{
????????display:?block;???//這是可完成懸浮時(shí)的背景改變效果
????????text-decoration:?none;
????????color:?black;
????}
????a:hover{
????????color:?white;
????????background-color:?#ccc;
????????font-weight:?bold;
????}
????li:hover{
????????border:1px?solid?#DDD;
????????border-right:?0;
????????box-shadow:?0?0?8px?#fba;
????}
????li:hover?.sec{
????????display:?block;
????}?
????.sec{
????????display:none;
????????position:absolute;????//這個(gè)是絕對的
????????top:?40px;
????????left:102px;
????????width:?200px;
????????height:?30px;
????????border:1px?solid?#fba;
????????z-index:?4;
????}
????</style>
</head>
<body>
??<ul?>
??????<li?><a?href="#">銷售</a>
????????<div?class="sec">
????????????這是銷售服務(wù)
????????</div>
??????</li>
??????<li><a?href="#">庫存</a>
?????????
??????</li>
??????<li><a?href="#">財(cái)務(wù)</a>
????????
??????</li>
??????<li><a?href="#">信息</a>
?????????
??????</li>
??</ul>
?
</body>
</html>這是代碼下面是運(yùn)行結(jié)果“這是銷售系統(tǒng)”為什么不能和“銷售”同行呀？
有關(guān)分類導(dǎo)航，請大神指點(diǎn)下，為何光標(biāo)懸浮在主菜單時(shí)，我的二級菜單不能和主菜單在同一行
qq_aslongas_0
2017-06-30 18:40:20
