如何讓li在ul上面
從大家的提問中發(fā)現(xiàn),把margin-bottom設(shè)為-2px就可以用li的下邊框遮蓋ul的下邊框。但是我不管怎樣試,都是ul的下邊框遮蓋了li的下邊框。結(jié)果如圖,代碼如下
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>實(shí)踐題 - 選項(xiàng)卡</title>
? ? <style type="text/css">
? ? *{
? ? ? ? margin=0px;
? ? ? ? padding=0px;
? ? ? ? font: 10pt/13pt "微軟雅黑", times;
? ? }
? ? .tab{overflow:hidden;padding:0px;border-bottom:2px solid #8B4513;}
? ? .tab li{float:left;
? ? ? ? ? ? width:70px;
? ? ? ? ? ? height:35px;
? ? ? ? ? ? line-height:35px;
? ? ? ? ? ? text-align:center;
? ? ? ? ? ? list-style-type:none;
? ? ? ? ? ? border:2px solid black;
? ? ? ? ? ? margin:0px 2px -2px 2px;
? ? }
? ? ? ?
? ? </style>
? ? <script type="text/javascript">
? ? ? ? ?
? ? // JS實(shí)現(xiàn)選項(xiàng)卡切換
? ??
? ??
? ? </script>
?
</head>
<body>
? ? <ul>
? ? ? ? <li>房產(chǎn)</li>
? ? ? ? <li>家居</li>
? ? ? ? <li>二手房</li>
</ul>
2016-03-25
要想讓<li>元素border-bottom不顯示的方法其實(shí)方法有很多。原則上都是讓<li>在前遮住<ul>的底線就行。
理論上用不用overflow:hidden對(duì)<li>是否在前都不會(huì)有影響。。overflow:hidden主要是用來隱藏溢出的內(nèi)容,以及用來清除對(duì)父元素的浮動(dòng)影響。
用overflow:hidden當(dāng)沒有設(shè)置父元素高度時(shí)可以將父元素?fù)伍_,當(dāng)設(shè)置父元素高度時(shí),多于父元素高度的內(nèi)容將被隱藏。。。。
可以用diaplay:inblock; ? position:等定位屬性 ; float屬性;都可以實(shí)現(xiàn)。讓li 和ul的下邊框重合,把li 的下邊框顏色下設(shè)置成白色或底色就好了
這是我的理解,希望能幫到你。。。
2016-03-23
你的ul的class應(yīng)該就是tab吧
.tab li{ }里加一句border-bottom:none;去了下邊框應(yīng)該就成了
2016-03-23
border-bottom:none;