网站（十五）CSS使用变换

最新推荐文章于 2022-11-12 19:13:55 发布

KeithAlexander

最新推荐文章于 2022-11-12 19:13:55 发布

阅读量193

点赞数

分类专栏：学习笔记

本文链接：https://blog.csdn.net/KeithAlexander/article/details/80974062

版权

学习笔记专栏收录该内容

38 篇文章 0 订阅

订阅专栏

CSS使用变换

transform
- rotate：旋转角度
- scale：倍数
  - scalex
  - scaley
- origin：中心点坐标
  - px,px
  - top right left bottom

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Examples</title>
    <style type="text/css">
        p {
            width: 100px;
            height: 100px;
            background-color: antiquewhite;
        }
        p:hover{
            /*width: 100px;
            height: 100px;*/
            background-color: antiquewhite;
            /*transform:rotate(-30deg);*/
            transform-origin: top right;
            transform:scale(1.5);
        }
    </style>
</head>

<body>
    <p></p>
</body>

</html>