製作響應較大的圖像

Question

我試圖製作一個響應式電子郵件模板，用信封從信封中取出。

該字母小於信封，我無法以與div相同的方式調整它。
如果我把width: 100%放在信封上，我會得到相同的div大小，所以不好。
如果我把margin-left: -50px;放在左邊，右邊的信封保持默認大小和div大小。

我正在使用引導網格系統。

這是模板：http://www.kakaostudio.it/newsletter_v1/index_test.html

這是最終的結果：

Answer 1

蠻力的方法是如下，這會給你如何進行一個好主意。

.envelop img { 
margin-top: 50px; 
margin-left: -60px; 
width: 113%; 
} 
.envelop { 
padding: 0; 
margin: 0; 
} 

通過這樣做，您可以使信封的寬度更大，以便與上面的div相匹配。然後將其左移至負左邊。

我有一個1920px寬度的屏幕，它對我來說完全同步顯示，但它對這種方法沒有反應。您需要使用許多媒體查詢來調整大小。

您可以嘗試左右空白負數％或甚至更好的「vw」值。位置：左邊的相對值和負值會給出與邊緣左邊相同的結果。

Image我的方法的結果。