欢迎光临
我们一直在努力

css如何缩放div元素

在css中,可以利用transform属性来缩放div元素,当该属性的值为“scale(x,y)”时,就可以对元素进行缩放转换,语法为“transform:scale(横向缩放比例,竖向缩放比例);”。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

css如何缩放div元素

我们可以通过transform属性来对div元素进行缩放的操作,当transform属性的值设置为“scale(x,y)”时,表示我们可以对div元素进行2D缩放转换。

下面我们通过示例来看一下怎样对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>

输出结果:

(学习视频分享:css视频教程)

赞(0)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。