zoukankan      html  css  js  c++  java
  • IE8 div旋转 Matrix,模拟轮播前后翻页按钮

    1.css代码:(IE不是绕中心点旋转,图形会贴着上边和左边旋转)

    .out2{
        padding-top: 30px;
        background: #883432;
        height: 100px;
    }
    
    .prev{
        margin-left:50px;
        width: 40px; 
        height: 40px; 
        transform: rotate(-45deg); 
        -o-transform: rotate(-45deg); 
        -webkit-transform: rotate(-45deg); 
        -moz-transform: rotate(-45deg); 
        border-top:3px solid white;
        border-left:3px solid white;
        display: inline-block;
         filter:progid:DXImageTransform.Microsoft.Matrix(M11=0.707,M12=0.707,M21=-0.707,M22=0.707,SizingMethod='auto expand');
    
    }
    .next{
        margin-left:50px;
        width: 40px; 
        height: 40px; 
        transform: rotate(135deg); 
        -o-transform: rotate(135deg); 
        -webkit-transform: rotate(135deg); 
        -moz-transform: rotate(135deg); 
        border-top:3px solid white;
        border-left:3px solid white;
        display: inline-block;
        filter:progid:DXImageTransform.Microsoft.Matrix(M11=-0.707,M12=-0.707,M21=0.707,M22=-0.707,SizingMethod='auto expand');
    }

    html:

    <div class='out2'>
        <div class='prev'></div>
        <div class='next'></div>
    </div>

    模拟轮播的两个 向前、向后箭头

    注:矩阵可参考:http://zywhunter.blog.163.com/blog/static/6465994120121164913173/

  • 相关阅读:
    使用Stream流递归 组合树形结构
    MySQL 8 通用表表达式
    sa-token 权限认证
    先更新缓存还是先更新数据库?
    钉钉 回调事件 消息加解密
    commons-io
    stream和parallelstream的区别
    消除if...else
    springboot 扩展xml请求和响应
    springboot admin 邮箱
  • 原文地址:https://www.cnblogs.com/xiaozhuyuan/p/8483200.html
Copyright © 2011-2022 走看看