繼承另一個div的顏色？

我想邊界div「ItemListHeader」繼承另一個div「color1」的顏色不是父項（結構HTML波紋管）可能與CSS或JS？謝謝

#color1{ 
 
    background-color: rgba(11, 114, 180, 1); 
 
} 
 
#color2{ 
 
    background-color: rgba(1, 14, 18, 0); 
 
} 
 
.ItemListHeader{ 
 
border-right: 30px solid (inherit); 
 
}

<div class="List"> 
 
<ul class="Menu"> 
 
    <li class="topic1"> 
 
     <div id="color1" class="ColorBaseTopics"></div> 
 
      <ul class="SubTopic1"> 
 
       <li> 
 
        <div class="ItemListHeader"> 
 
        
 
        </div> 
 
       </li> 
 
      </ul> 
 
    </li> 
 
     <li class="topic2"> 
 
     <div id="color2" class="ColorBaseTopics"></div> 
 
      <ul class="SubTopic2"> 
 
       <li> 
 
        <div class="ItemListHeader"> 
 
        
 
        </div> 
 
       </li> 
 
      </ul> 
 
    </li> 
 
</ul> 
 
</div>

來源

2017-06-22 Faxelf

爲什麼不給顏色類的名稱，並添加到這兩個元素？ –

在這裏，在CSS中，將color1聲明爲CLASS，並在div中將其用作ID。它也不會應用第一格的顏色 –

@DanielH，因爲他想將背景顏色「複製」到邊框 –

有可能與sass variables

或者，正如其他人所提到的，通過在兩個對象相同的類

來源

2017-06-22 13:32:47 Dotan

有喜歡LESS工具，這使您可以在更高級別的抽象層次上撰寫CSS。

以下稱這些「混入」

而不是

/* CSS */ 
#header { 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px; 
    border-radius: 8px; 
} 

#footer { 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px; 
    border-radius: 8px; 
}

可以說

/* LESS */ 
.rounded_corners { 
    -moz-border-radius: 8px; 
    -webkit-border-radius: 8px; 
    border-radius: 8px; 
} 

#header { 
    .rounded_corners; 
} 

#footer { 
    .rounded_corners; 
}

來源

2017-06-22 13:45:00

繼承另一個div的顏色？

回答

相關問題