我如何讓自己的形象得到反應？

我試圖讓我的圖像響應，以便當它在移動設備上的圖像將縮小，但我不能得到它的工作。我如何讓自己的形象得到反應？

我嘗試過使用高度和寬度100％。

任何人都可以幫助我嗎？

這是我的網站：www.promegaekonomi.se（其我MENY下BBIG圖像多數民衆贊成）

2014-09-02 bear

嘗試設置只是高度**或**寬度，而不是設置爲100％。 – TylerH 2014-09-02 18:17:58

可能的重複[如何使圖像響應？]（http://stackoverflow.com/questions/24828377/how-can-i-make-this-image-responsive） – TylerH 2014-09-02 18:19:08

max-width: 100%如果你的圖像與CSS（而不是在<img>應用應該做的伎倆

標籤），你可以嘗試：

background-size: cover或background-size: 100% auto

來源

2014-09-02 18:17:58

這可行！我的形象被削減了兩個，所以當我使用它時，它看起來很奇怪，但仍然是正確的和敏感的。我如何排列他們？ – bear 2014-09-02 19:14:54

根據您選擇的方法，如果您不希望自行平鋪，您可能還需要在背景圖像上設置不重複。然後，您應該設置媒體查詢並將＃full-size-image-wrapper div的高度調整爲215px（在較小的屏幕上），而不是在桌面版上的386px。 – 2014-09-02 20:22:24

這兩個圖像都設置爲無重複的CSS。但有一條白線我不能刪除？當我爲較小的屏幕設置尺寸時，圖像下方會出現一個白色框，它隨時會改變。當你調整窗口大小時，你會看到我的意思 – bear 2014-09-02 21:14:32

遺憾不能添加評論，如果您還可能要添加到height:auto;的圖像

編輯 - 查看您的網站，如果您的背景圖像指的是跨越全寬，您可以添加background-size:cover;並在您的網站縮放時使用媒體查詢更改高度。

來源

2014-09-02 18:32:37 Nickfmc

用css：

img{height:auto; width:100%;}

或者......

你可以隱蔽的圖像SVG文件，它會不斷調整其大小自動...

來源

2014-09-02 18:39:10

If you are using Bootstrap 3.0 then you can add only class="img-responsive" 

Something like that: 

<img class="img-responsive" src="img/sponsor/nescafe.png" alt="nescafe">

否則：

<img class="responsive-photo" src="img/sponsor/nescafe.png" alt="nescafe">

CSS：

.responsive-photo{ 
    height: auto; 
    max-width: 100%; 
}

來源

2014-09-02 18:42:54 Bipon

我如何讓自己的形象得到反應？

回答

相關問題