CSS3图片旋转功能transform:rotate以及Canvas旋转示例

最新推荐文章于 2024-04-16 16:33:00 发布

smartsmile2012

最新推荐文章于 2024-04-16 16:33:00 发布

阅读量8k

点赞数

分类专栏： HTML & CSS

本文链接：https://blog.csdn.net/smartsmile2012/article/details/67635067

版权

<!DOCTYPE html>
<html>
<head>
    <title>CSS3旋转图片</title>
    <style>
        .demo {
            width: 100px;
            height: 75px;
            background-color: yellow;
            border: 1px solid black;
            margin:20px;
        }

        #div2 {
            transform: rotate(30deg);
            -ms-transform: rotate(30deg); /* IE 9 */
            -moz-transform: rotate(30deg); /* Firefox */
            -webkit-transform: rotate(30deg); /* Safari and Chrome */
            -o-transform: rotate(30deg); /* Opera */
        }

        #div3 {
            transform: rotate(90deg);
            -ms-transform: rotate(90deg); /* IE 9 */
            -moz-transform: rotate(90deg); /* Firefox */
            -webkit-transform: rotate(90deg); /* Safari and Chrome */
            -o-transform: rotate(90deg); /* Opera */
        }
    </style>
</head>
<body>
    <div class="demo" id&#

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

smartsmile2012

关注关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
打赏
0
评论
CSS3图片旋转功能transform:rotate以及Canvas旋转示例

CSS3旋转图片 .demo { width: 100px; height: 75px; background-color: yellow; border: 1px solid black; margin:20px; }
复制链接

扫一扫