Question

我想在我创建的表格中旋转3张图像。我已将图像添加到此帖子中。我很难学习如何这样做，我找不到任何东西。我希望它能不断旋转。旋转应该像在其轴上旋转的行星一样。 BARCELONA

<table>
    <tr>
        <th colspan="2"><h3>Favorite Teams</h3></th>
    </tr>
    <tr>
        <th>Team</th>
        <th>What sport?</th>
        <th>Logo</th>
    </tr>
    <tr>
        <th>Pittsburgh Steelers</th>
        <th>American Football</th>
        <th><img src="steelers.jpg" height="100"></th>
    </tr>
    <tr>
        <th>Michigan Wolverines</th>
        <th>American Football</th>
        <th><img src="wolverines.jpg" height="100"></th>
    </tr>
    <tr>
        <th>FC Barcelona</th>
        <th>Football</th>
        <th><img src="barcelona.jpg" height="100"></th>
    </tr>
</table>

Answer 1

这将旋转图像。

如果您想为旋转设置动画 - 请参阅以下答案：CSS3 Rotate Animation

＆＃13;

.rotate {
  -webkit-transform: rotate(20deg);
  transform: rotate(20deg);
}

＆＃13;

    <table>
        <tr>
            <th colspan="2"><h3>Favorite Teams</h3></th>
        </tr>
        <tr>
            <th>Team</th>
            <th>What sport?</th>
            <th>Logo</th>
        </tr>
        <tr>
            <th>Pittsburgh Steelers</th>
            <th>American Football</th>
            <th><img class="rotate" src="steelers.jpg" height="100"></th>
        </tr>
        <tr>
            <th>Michigan Wolverines</th>
            <th>American Football</th>
            <th><img class="rotate" src="wolverines.jpg" height="100"></th>
        </tr>
        <tr>
            <th>FC Barcelona</th>
            <th>Football</th>
            <th><img class="rotate" src="barcelona.jpg" height="100"></th>
        </tr>
    </table>

＆＃13;

如何在HTML中旋转单个图像？

1 个答案: