Css 如何使div中的元素重复旋转？

我有一个

div

，既不能使用

ID

也不能使用

class

我只能像这样使用

名称

：

<div name="picture">
    <img src="http://i.imgur.com/p0Fu5UZ.jpg" />
</div>
<div name="info">
    <p>- Insert information here</p>
</div>

---

选择任何特定的

div

的合适方法是什么，因为

[name=picture]

不适用于填充代码和非填充代码。我能做些什么来解决这个问题？

它应该适合您：

CSS:

div[name="picture"] {
    -webkit-animation: name 4s infinite linear
}
@-webkit-keyframes name {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }

<div name="picture">
    <img src="http://i.imgur.com/p0Fu5UZ.jpg" />
</div>
<div name="info">
    <p>- Insert information here</p>
</div>

HTML:

div[name="picture"] {
    -webkit-animation: name 4s infinite linear
}
@-webkit-keyframes name {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }

<div name="picture">
    <img src="http://i.imgur.com/p0Fu5UZ.jpg" />
</div>
<div name="info">
    <p>- Insert information here</p>
</div>

-在此处插入信息

演示：

如果需要div内的元素旋转，则可以将选择器修改为

div[name=“picture”]img

或

div[name=“picture”]p

：谢谢，div[name=“picture]正是我需要的。