css:dir =“rtl”VS style =“direction:rtl”

我知道当方向是内联时如何设计样式
<div dir="rtl">foo</div>

div[dir="rtl"]
{
 ....;
}

但如何风格

<div style="direction:rtl">foo</div> ?

两者都表现得如预期的那样(文本的右“对齐”)但我需要对内部的某些元素进行更精细的调整(float,text-align …)并且我无法在第二种情况下正确设置我的规则.

我无法编辑html.我必须使用style =“direction:rtl”.

解决方法

由于你不能修改HTML,一个非常hacky选择器将是:
div[style*="direction:rtl"] {
    ...
}

JSFiddle demo.

请注意,我使用style * =而不是style =,因为这也将匹配不仅仅是方向的元素:在元素的style属性中声明的rtl.

为了增加选择器的强度,您还可以使用[style * =“direction:rtl”]来处理样式属性,这些属性属性的值与空格分开:

[style*="direction:rtl"],[style*="direction: rtl"] { ... }

或者在这种情况下,您可以匹配包含“rtl”的样式属性,因为我很确定这些字符组合不会用于任何其他属性(忽略外部资源,如背景图像文件名):

[style*="rtl"] { ... }

Updated JSFiddle demo.

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效