2013-07-23 35 views
0

我剛剛爲使用jQuery UI的2個選項卡創建了一個簡單容器,現在我要做的就是刪除出現在其下的邊框。我已經多次嘗試使用類似問題的信息,但仍然沒有任何結果。這裏是正在使用的代碼:jQuery-ui刪除底部邊框

<script> 
$(function() { 
    $("#Tabs").tabs(); 
}); 
</script> 

<div class="Tabs" id="Tabs"> 
    <ul> 
     <li><a href="#Tabs-1">Background</a></li> 
     <li><a href="#Tabs-2">Contact Info</a></li> 
     <li><a href="#Tabs-3">Photos</a></li> 
    </ul> 
    <div class="tabContent"> 

     <div id="Tabs-1"> 
      Some content 
     </div> 

     <div id="bgTabs-2"> 
      Some content 
     </div> 

    </div> 
</div> 

而CSS使用:

div.Tabs { 
height: auto; 
width: 625px; 
font-size: 18px; 
font-weight: bold; 

} 

.Tabs ul { 
margin: 0px; 
padding: 0px; 
list-style-type: none; 
cursor: pointer; 
} 

.Tabs ul li { 
    position: relative; 
    display: inline; 
    text-align: center; 
} 

    .Tabs ul li a { 
     padding: 0px 15px; 
     text-decoration: none; 
     text-decoration-color: black; 
     text-decoration-style: none; 
     border-bottom:none; 
    } 

即使是「底部邊框:無」行,我不斷收到一個邊界。無論我放在哪裏。 我甚至試過 .ui-widget-content {0} {0} {0}} border:none; }

同樣,我確實搜索過這個網站,但我想通過這種最簡單的形式詢問它,這個代碼應該有助於未來的參考。

回答

-1

我認爲你的問題將通過使用border:0;而不是border:none;來解決。
嘗試使用這樣的事情:

.ui-widget-content { 
    border-bottom:0; 
} 

或像這樣:

.ui-widget-content { 
    border:0; 
} 

Working Example

+0

這會影響UI的小部件內容中的所有對象。不能接受的。 – catbadger