Bootstrap兩個部分一個重疊圖像

Question

我正在使用Bootstrap來製作此設計。我想知道有一個內聯圖像跨越兩個部分與背景圖像的最佳方法。

這顯然會響應。

任何意見表示讚賞。謝謝！

Answer 1

我們可以通過爲它們創建3個div和容器來實現此目的，併爲容器賦予相對位置，併爲第3個div賦予絕對位置。 代碼：

 .box_1 { 
      background-color: #c1c1c1; 
      height: 100px; 
     } 
     .box_2 { 
      background-color: #cc0000; 
      height: 100px; 
     } 
     .box_3 { 
      background-color: #000; 
      display: block; 
      height: 100px; 
      left: 42%; 
      position: absolute; 
      top: 50px; 
      width: 50px; 
     } 
     .box_container { 
      position: relative; 
     } 
[Working example][1]https://jsfiddle.net/4c22acc0/