標誌在多個div一次

Question

我創建了一個網站，並設計了頭

紅色和藍色是圖像 黃河是一個導航欄 圓是一個標誌 我的問題是，我我無法同時將徽標放在圖像的div和導航div中。這甚至可能，或者我應該考慮一個新的設計。也許我錯誤地看着這個。

Answer 1

你的問題是關於在導航欄和div上都有相同的圖像。

Pen here!

你可以用背景圖像容易做到這一點，並設置相同的圖像以及。

background-image: url(http://s.glbimg.com/jo/g1/f/original/2016/05/02/palestinian-gaza-daily_life_mohammed_abed_afp.jpg); 
    background-size: cover; 
    backgroud-position: center center; 

Answer 2

這可以使用純CSS來實現。這是一種可能的方法來得到你想要的東西：

#one { 
 
    height: 100px; 
 
    background-color: blue; 
 
} 
 

 
#two { 
 
    position: relative; 
 
    width: 50px; 
 
    height: 50px; 
 
    background-color: red; 
 
    border-radius: 100px; 
 
    transform: translateY(40px); 
 
    margin: 0 auto; 
 
    z-index: 1; 
 
} 
 

 
#three { 
 
    position: relative; 
 
    height: 30px; 
 
    background-color: yellow; 
 
    bottom: -20px; 
 
}

<div id="one"> 
 
    <div id="two"> 
 
    </div> 
 
    <div id="three"> 
 
    </div> 
 
</div>

更換的div任何塊級元素，它應該工作了。否則，您需要設置display: block。