将CSS样式设置为具有特定样式的元素

Question

我的内容中有很多图像，预设样式有<img src="" style="float:left">或<img src="" style="float:right">

我想为它们设置不同的边距，具体取决于它们的浮动方式。是否可以为具有预设样式的图像设置CSS样式？

谢谢！

Answer 1

严格来说，您所使用的（CSS3）选择器是属性包含选择器：

img[style*="float:left;"] { margin: ; }
img[style*="float:right;"] { margin: ; }

与Lister先生的回答不同，即使元素具有其他内联样式，它也会起作用。也就是说，我更喜欢Lollero的答案，即使用课程并以这种方式应用你的边缘;它将与浏览器100％兼容！

Answer 2

我不知道你为什么要这样做，所以我建议这样做：

http://jsfiddle.net/ZDjWT/

HTML：

<img class="left" src="http://lorempixel.com/g/200/100/" alt="" />
<img class="right" src="http://lorempixel.com/g/200/100/" alt="" />

CSS：

.left {
    float: left;
    margin-left: 30px;
}
.right {
    float: right;
    margin-right: 30px;
}

Answer 3

是的，只要样式只有"float:left"并且不包含其他属性或冒号周围的空格，您就可以在CSS中编写img[style='float:left']。

如果style属性也可以包含其他内容，那么最好使用Javascript添加属性。 （检查.. .style.float）

编辑：正如Pekka所说，CSS并不适用于所有浏览器。也许在图像中添加一个类是更好的主意！