針對平板電腦和手機的縮放圖像

我注意到，在我的某些網頁上，當我瀏覽它們時，即。平板電腦或Android手機，圖像看起來太大，而網站的其他部分正確縮小。在平板電腦/手機上查看時，是否有CSS屬性或某種東西可以使我的圖像適當縮小？針對平板電腦和手機的縮放圖像

謝謝。

編輯：我說的是使用背景圖像的CSS屬性

2013-07-19 Krešimir Čulina

UPDATE

是的，你可以使用媒體查詢

檢查以下鏈接即可開始使用時約。希望這有助於

http://mediaqueri.es/ 

http://css-tricks.com/css-media-queries/

樣品例如

@media screen and (max-width:480px) 
{ 
    img 
    { 
    background-image:url('yourimage.jpg)"; 
    height:50px; 
    width:50px; 

    } 

} 

@media screen and (max-width:750px) 
{ 
    img 
    { 
    background-image:url('yourimage.jpg)"; 
    height:250px; 
    width:250px; 

    } 

}

來源

2013-07-19 11:57:12

這不是好的形式，但如果添加以下CSS到圖像頁面上，他們將擴大

img.content { 
    max-width: 100%; 
}

（不過，他們還會將整個巨型圖像下載到手機中，因此請小心不要使用任何巨大的圖像，並且如果您可以將圖像添加到會檢測手機或桌面的網站，那麼您可以將巨型圖像發送到桌面，並將更小，更多的電話帶寬友好圖像發送到手機）

來源

2013-07-19 19:45:14 leeand00

針對平板電腦和手機的縮放圖像

回答

相關問題