使用img src加載圖像會在Mozilla / Chrome中產生不同的大小

[英]loading image using img src results in different size in Mozilla/Chrome


I am not an UI expert. For one of the requirement to show the reload icon, I downloaded the 128x128 pixel reload icon from the link - https://www.iconfinder.com/icons/28464/recycle_refresh_reload_sync_icon

我不是UI專家。對於顯示重新加載圖標的要求之一,我從鏈接下載了128x128像素重新加載圖標 - https://www.iconfinder.com/icons/28464/recycle_refresh_reload_sync_icon

and used in my html page. Actually this was designed for a catcha page.

並在我的html頁面中使用。實際上這是為catcha頁面設計的。

<body>
<img src="reload.ico" />
</body>

When opened in Firefox, this was shown as a small image, but when opened in Chrome, it is relatively large. What is the reason behind this?

在Firefox中打開時,這顯示為一個小圖像,但在Chrome中打開時,它相對較大。這背后的原因是什么?

I agree that after changing the code to ,

我同意在更改代碼后,

<body>
<img src="reload.ico" width="24px" height="24px" />
</body>

both the browsers are showing the same size. But i am interested to know why it was not in the first case.

兩個瀏覽器都顯示相同的大小。但我很想知道為什么它不是第一種情況。

edit: Actually I accidentally downloaded the 128x128. But then i am surprised to see this difference.

編輯:其實我不小心下載了128x128。但是,我很驚訝地發現這種差異。

1 个解决方案

#1


1  

The .ico files are only supported for the favicon.

.ico文件僅支持favicon。

Prefer the .png files for transparent images/icons.

首選.png文件以獲取透明圖像/圖標。

You can see a list of supported formats per browser at Comparison of web browsers on wikipedia

您可以在維基百科上的Web瀏覽器比較中查看每個瀏覽器支持的格式列表


注意!

本站翻译的文章,版权归属于本站,未经许可禁止转摘,转摘请注明本文地址:https://www.itdaan.com/blog/2014/03/27/6928dd3a9e3282df22e49b2114ab7db4.html



 
粤ICP备14056181号  © 2014-2020 ITdaan.com