如何利用css實現(xiàn)圖片等比例縮放？！ 1. 我們可以將圖像的IMG標(biāo)簽設(shè)置為寬度或高度的任意一個，圖像將自動等比縮放。下面是代碼，如圖所示。2. 然后，打開瀏覽器查看縮放圖像效果，如下圖所示。3. 我

如何利用css實現(xiàn)圖片等比例縮放？

！

1. 我們可以將圖像的IMG標(biāo)簽設(shè)置為寬度或高度的任意一個，圖像將自動等比縮放。下面是代碼，如圖所示。

2. 然后，打開瀏覽器查看縮放圖像效果，如下圖所示。

3. 我們也可以使用CSS3方法，變換比例，來縮放圖像。如圖所示。

4. 最終的縮放效果如下圖所示。

如果要將圖片的高度和寬度設(shè)置為不超過固定值，則當(dāng)圖片的高度或?qū)挾瘸^此值時，需要將圖片縮小到此大小。

1. 對于現(xiàn)代瀏覽器，如Firefox或IE7及更高版本，可以直接使用兩個CSS屬性max width和max height。

2. 對于IE6.0及以下版本，上述兩個CSS屬性將不會被忽略。在處理這類事情之前，我們經(jīng)常使用JavaScript。

css如何使頁面縮小后不變？

1. 打開編輯器，創(chuàng)建一個HTML文檔，并設(shè)置基本架構(gòu)。

2. 我們使用img標(biāo)簽來嵌入圖像，我們可以看到如果頁面收縮，圖像不會收縮，所以頁面會變形。

3. 然后創(chuàng)建一個CSS文檔并將其與當(dāng)前HTML文檔相關(guān)聯(lián)。使用鏈接標(biāo)記。

4. *{text align:Center}img{width:800px height:800px}為了便于顯示，我們首先將圖像居中，并設(shè)置底部的長度和寬度。

5. @僅媒體屏幕和（最大寬度：600px）{img{width:300px height:300px}現(xiàn)在我們在CSS文件后添加這行代碼，這意味著當(dāng)頁面縮小到600px時，圖片的長度和寬度也會減小。在這里我們要注意尺度。

6. 然后我們試著縮小頁面的大小，我們可以看到它會縮小，這樣我們就可以做出同樣的效果。