html - 为什么这个由 HTML 和 CSS 控制的图像会自动旋转？

Question

我有一个由以下 CSS 代码控制的图像：

img.background
{
    z-index: -1;
    position: absolute;
}

以下 HTML 代码还控制图像：

<img class = "background" src = "images/bhleerotated.JPG">

即使此图像旋转 180 度，它仍然显示为与未旋转图像具有相同方向的图像。为什么会出现这种情况？

Answer 1

我能够使用您提供的代码和 CSS 变换：旋转（45 度）。你如何旋转图像、Javascript/jQuery 或 CSS3 转换？

JSFiddle 示例：http: //jsfiddle.net/eDGhR/

HTML：

<img class="background" src="images/bhleerotated.jpg">

CSS：

img.background {
    z-index: -1;
    position: absolute:
    transform: rotate(45deg);
}