在css中,可以利用transform屬性來縮放div元素,當該屬性的值為“scale(x,y)”時,就可以對元素進行縮放轉(zhuǎn)換,語法為“transform:scale(橫向縮放比例,豎向縮放比例);”。
本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
css如何縮放div元素
我們可以通過transform屬性來對div元素進行縮放的操作,當transform屬性的值設(shè)置為“scale(x,y)”時,表示我們可以對div元素進行2D縮放轉(zhuǎn)換。
下面我們通過示例來看一下怎樣對div進行縮放,示例如下:
<!DOCTYPE html> <html> <head> <style> .no{ width:300px; height:100px; background-color:#ff9900; } .yes{ width:300px; height:100px; background-color:#ff9900; transform:scale(0.5,0.5); } </style> </head> <body> <p>沒縮放的div元素:</p> <div class="no"></div> <p>縮放的div元素:</p> <div class="yes"></div> </body> </html>
輸出結(jié)果:
(學習視頻分享:css視頻教程)