skew() - 倾斜变换

语法说明

            transform: skew(x-angle, y-angle);
          

• x-angle - X 轴方向的倾斜角度
• y-angle - Y 轴方向的倾斜角度（可选，默认为 0）
• skewX 正值：顶部向左，底部向右（\ 形状）
• skewY 正值：左侧向上，右侧向下
• 常用单位：deg（度）

skewX(30deg) 顶部向左，底部向右，产生平行四边形效果

            .box { transform: skewX(30deg);
            /* 等价于 skew(30deg, 0) - 形成 \ 形状 */
            }
          

示例 2：Y 轴倾斜

skewY(20deg) 左侧向上，右侧向下

            .box { transform: skewY(20deg);
            /* 等价于 skew(0, 20deg) */
            }
          

示例 3：双轴倾斜

skew(20deg, 10deg) 同时在 X 和 Y 轴上倾斜

            .box { transform: skew(20deg, 10deg);
            /* X 轴倾斜 20 度，Y 轴倾斜 10 度 */
            }