響應圖像電網 - 3張圖片，1左2右疊

Question

好了，這裏是我在這裏： http://www.discountramps.com/powersport-products/c/BRAND-BW/

感謝您的幫助迄今爲止。與我的百分比或東西似乎關閉。當我調整瀏覽器的大小時，圖像會中斷。我希望他們能夠進行縮放，直到遇到媒體查詢。這有意義嗎？

再次感謝您的幫助！ - 艾倫

Answer 1

這是您的問題的可能佈局，現在玩它。

/*colors*/ 
 

 
.black { 
 
    background: black 
 
} 
 
.red { 
 
    background: red 
 
} 
 
.green { 
 
    background: green 
 
} 
 
/*layout*/ 
 

 
.black, 
 
.sidebar { 
 
    float: left; 
 
    width: 50%; 
 
    height: 100vh 
 
} 
 
.red, 
 
.green { 
 
    height: 50vh 
 
} 
 
/* responsive */ 
 

 
@media screen and (max-width: 480px) { 
 
    .black, 
 
    .sidebar { 
 
    width: 100%; 
 
    float: none 
 
    } 
 
}

<div class="black"></div> 
 
<div class="sidebar"> 
 
    <div class="red"></div> 
 
    <div class="green"></div> 
 
</div>