css中斜着的图片怎么设置

在网页设计中，经常需要使用斜着的图片来装饰页面，例如在标题旁边放置一张斜着的图标。这时候，我们可以使用CSS来设置图片的旋转角度，使之变成斜着的形式。

要设置一张图片斜着显示，我们需要用到CSS3中的transform属性。该属性允许我们对任意元素进行旋转、缩放、倾斜、移动等操作。

img{
    transform: rotate(-20deg);
} 

其中，rotate函数用于设置旋转的角度，负数表示逆时针旋转，正数表示顺时针旋转。例如上面的代码表示将图片逆时针旋转20度。

为了使图片显示完整，我们还需要将其容器的尺寸调整为适当的大小，否则会出现图片被截断的情况。

.container{
    width: 200px;
    height: 200px;
    overflow: hidden;
}

.container img{
    transform: rotate(-20deg);
    width: 280px;
    height: 280px;
    margin-left: -40px;
    margin-top: 40px;
} 

这里，我们使用了一个名为container的div元素来包含图片，设置其宽度、高度和overflow属性，使之适当地显示图片。而图片本身则设置为更大的尺寸，同时使用margin属性调整其位置，使之不被截断。通过这样的设置，我们可以轻松地实现在任意位置、任意旋转角度下显示斜着的图片。