如何在HTML中更改ul標簽CSS的屬性

Question

我正在使用Bootstrap jquery和CSS的Slide，它運行正常，沒有問題。

這是我的來源：

<div id="photos" class="tabcontent">
   <div id="ninja-slider">                                                                          
        <div>
           <div class="slider-inner">
              <ul>                 
                 <li><a class="ns-img" href="<%=request.getContextPath()%>/resources/images/car1.jpg"></a></li>
                 <li><a class="ns-img" href="<%=request.getContextPath()%>/resources/images/ban-xe-honda-civic.jpg"></a></li>
                 <li><a class="ns-img" href="<c:out value="${product.thumbnail3}"/>"></a></li>
                 <li><a class="ns-img" href="<c:out value="${product.thumbnail4}"/>"></a></li>
                 <li><a class="ns-img" href="<c:out value="${product.thumbnail5}"/>"></a></li>                                                                          
              </ul>
            <div class="fs-icon" title="Expand/Close"></div>
        </div>                   
   </div>
</div>

這是我的CSS：

#ninja-slider .ns-img {
  background-color: rgba(0,0,0,0.3);
  background-size: contain;
  border-radius: 3px;
  cursor: default;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  padding-top: 67%;
}
#ninja-slider .slider-inner {
  width: 727px;
  margin: -2px auto;
  font-size: 0px;
  position: relative;
  box-sizing: border-box;
}

當我檢查並在瀏覽器上運行Firebug時，似乎自動在標簽處​​生成了一些行：

<ul style="overflow: hidden; padding-top: 50%; height: 0px;">

如何刪除那些自動生成的行或我可以更改： padding-top：50％到padding-top：67％還是我可以解決此問題的任何解決方案。

Answer 1

正如@Terry所說的那樣，那些內聯樣式可能是由庫添加的，如果仍然要覆蓋它們，則可以使用jquery css

$('#ninja-slider ul').removeAttr('style');
$('#ninja-slider ul').css("color","blue");

基於此答案： https : //stackoverflow.com/a/38194916/2894798

Answer 2

您可以使用!important 。

<ul class="myul" style="overflow: hidden; padding-top: 50%; height: 0px;">

太覆蓋內聯樣式，您可以執行此操作

.myul {
  padding-top: 67% !important;
}

或者您可以使用@Renzo Calla提供的javascript解決方案

Answer 3

在這種情況下，我必須向您建議一種簡單而骯臟的方法：在CSS中添加

#ninja-slider ul{
     padding-top: 67%!important;
}

這樣可以解決問題。 如果您將在該頁面中提供js，我將提供一個答案來編輯將ul元素中的css設置為padding-top：67％而不覆蓋它的內容。