無法給出具體的ul不同的css風格？

我得給HMTL的這部分特定CSS樣式：無法給出具體的ul不同的css風格？

<div id = "comp_display1" style = "display: none;"> 
<div class = "ui-widget-overlay ui-front"></div> 

<div class="ui-helper-hidden-accessible" role="log" aria-live="assertive" aria-relevant="additions"></div> 


<div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-front col-xs-3 " style= "height: auto !important; 
     width: auto !important; 
     overflow : scroll; 
    display: inline; 
    position: absolute; 

    left: 20%; 

    z-index: 500; 

    flex-wrap : wrap; 
    border: medium none; 
    border-bottom-right-radius: 4px; 
    border-bottom-left-radius: 4px; 
    border-top-right-radius: 4px; 
    border-top-left-radius: 4px;" 

    tabindex="-1" role="dialog" aria-describedby="signInPopup" aria-labelledby="ui-id-1"> 


<div> 
       <div class="whiteBg"> 
        <div class="sortingTabs"> 
    <div class="col-xs-1"></div> 

    <div class="col-xs-2">Details</div> 
    <div class="col-xs-3" id="name1">Hotel 1</div> 
    <div class="col-xs-3" id="name2">Hotel 2</div> 
    <div class="col-xs-3" id="name3">Hotel 3</div> 
</div> 
<center> 
<div class="table-responsive wrapper" id="infos"> 


<div class="row"> 
       <ul > 
        <li class="col-xs-1 compare"><img src="./details_files/experience.png" alt=""></li> 
        <li class="col-xs-2" ><strong>Total Experience</strong></li> 
        <li class="col-xs-3" id= "url1">7 Year(s)</li> 
        <li class="col-xs-3">7 Year(s)</li> 
        <li class="col-xs-3">7 Year(s)</li> 
       </ul> 
</div>   
. 
. 
. 
AND SO ON UNTIL ALL THE DIV'S HAVE CLOSED

我想給unorded列表這個CSS一個特定的風格：

ul li{ display: table-cell; 
    vertical-align: top; 
    width: 185px; 
    border-right: 5px solid #E6E6E6; 
    border-bottom: 5px solid #E6E6E6; 
    padding: 10px; 
    background-color: #FFF;}

我只希望這部分要更改的代碼。我應該如何標註CSS？

來源

2015-06-10 Ashwin Ramesh

所有的內聯CSS讓我哭內。使用來自祖先的特定選擇器（例如'＃infos'）預先安裝CSS語句。 – isherwood

請詳細說明...... –

給該行的div包裹ul一個特定的類，說list-wrapper然後這樣定義的風格：

.list-wrapper ul li { 
    ... 
}

來源

2015-06-10 15:27:34

這也是我的第一個停靠點，但我相信他只想在不編輯HTML的情況下鎖定那個特定的ul。 –

@samuidavid從...在html中，我不能認爲沒有其他的ul作爲#infos div的孩子。如果用戶不想更改html，那麼你的答案會更好。 –

我不確定我是否明白你的問題，但我相信你的意思，你只需要針對特定的ul而不編輯HTML本身，只對CSS做出更改？如果是這樣，您可以針對特定的ul通過指定它的父id，即：

#infos ul li { 
    display: table-cell; 
    vertical-align: top; 
    width: 185px; 
    border-right: 5px solid #E6E6E6; 
    border-bottom: 5px solid #E6E6E6; 
    padding: 10px; 
    background-color: #FFF; 
}

來源

2015-06-10 15:30:41

是的，我只想要目標ul li改變 –

@AshwinRamesh，這個答案有幫助嗎？如果答案對你有幫助，請將答案標記爲正確，因爲它將在未來幫助其他人。 –

無法給出具體的ul不同的css風格？

回答

相關問題