圖像在瀏覽器預覽中丟失質量

正如你所看到的，我的問題是瀏覽器預覽圖像。圖像在瀏覽器預覽中丟失質量

附件是原始圖像，並從我的網站的瀏覽器預覽截圖。

我的用於顯示圖像的代碼是：

HTML

<div class="pricebox col-lg-6 col-md-6 col-sm-6 col-xs-12 col-ss-12"> 
    <img src="assets/img/preturi/aerobic-nelimitat.png" class="img-pricebox img-responsive" alt=""/> 
</div>`

CSS

.pricebox {margin-bottom:35px;} 
.img-pricebox {width:100%; height:auto;}

中的圖像的尺寸是550px X 200像素佈置在COL-6格，足以我認爲任何展示。

怎樣才能提高質量？任何CSS解決方案，可能是一個特定的Photoshop渲染配置？ PS：另外，從我的配件上的本地預覽會失去一點點的質量。

來源

2016-01-16 Adrian

我看到的唯一區別是瀏覽器預覽中的淺灰色邊框。我應該看到其他的區別嗎？ – Santosh

第二個圖像是一個不脆，文字有點模糊 –

是的，那些小文本也是灰色的，就像一些不透明的應用一樣。 – Adrian

將圖像的最大寬度設置爲100％可以真正解決問題。

來源

2016-01-16 20:45:17 Santosh

550px X 200像素佈置在COL-6格，足以任何顯示我認爲

對於屏幕分辨率1366寬度，我不認爲550px爲col-6是不夠的，所以最好使用像700px寬度稍微高一點的分辨率，並再次檢查它

來源

2016-01-16 20:47:07

謝謝，我會試試。 – Adrian

歡迎您，讓我們知道它是否工作，希望它會 –

圖像在瀏覽器預覽中丟失質量

回答

相關問題