div上的中心位置圖像

Question

<img src="logo.jpg"> 
<div class="fadehover"> 
    <div class="a" ><img src="kulte_gray.jpg" /></div> 
    <div class="b" ><img src="kulte.jpg" /></div> 
</div> 

其實我想把圖像居中放在div容器上方。好吧，我嘗試了一個簡單的<center>標籤，但不知道這是否是所有瀏覽器的智能解決方案。有任何想法嗎？就像把它對齊在div？

Answer 1

<style> 
    #logo { 
     display: block; 
     margin: 0 auto; 
    } 
</style> 

↑這會將#logo居中放在其父容器中。

<div class="fadehover"> 
    <img src="logo.jpg" id="logo"> 
    <div class="a" ><img src="kulte_gray.jpg" /></div> 
    <div class="b" ><img src="kulte.jpg" /></div> 
</div> 

OR：

<!-- If you cannot put #logo into .fadehover 
    for some reason --> 
<div id="same-width-as-fadehover"> 
    <img src="logo.jpg" id="logo"> 
</div> 
<div class="fadehover"> 
    <div class="a" ><img src="kulte_gray.jpg" /></div> 
    <div class="b" ><img src="kulte.jpg" /></div> 
</div>