我正在构建一个jQuery插件,它使用CSS样式为嵌套的DIV标签添加颜色和边距.由于我宁愿将插件保存为单个文件,因此我的代码使用jQuery的.css()方法将这些颜色和边距直接作为CSS属性添加到DIV中.(初始化插件时,可以自定义这些属性的值.)
但是,我还希望让用户能够使用自己的样式表来设置这些DIV的样式,因此我还要为每组DIV添加类(其名称也可以自定义).这似乎是提供两全其美的最佳方式.
唯一的缺点似乎是内联style="..."属性(由jQuery的.css()方法生成)总是覆盖外部样式表中设置的类样式.当然,我可以!important在样式表中使用样式,但一次又一次地执行此操作非常麻烦.
所以:我真正想要的是一种方法,使联样式自动拍摄下比外部类样式的优先级,而无需进行外部类样式!important.
我还没有读过这样的事情.有什么建议？(或者:我是否应该采用另一种方法来设计插件中的DIV？)
zzz*_*Bov 12
!importantCSS 的反义词是什么？
没有完全相反的,但优先级选择器较低.
w3c规范定义了级联,不妨阅读它.
内联样式具有最高优先级,并且您使用的是低优先级样式,您需要通过样式表或style元素添加CSS .
因为您使用的是jQuery,所以添加自定义样式元素非常简单:
$('<style type="text/css">.foo {color: #FF0000;}</style>').prependTo('head');
您将要发现的问题是,.foo在样式表中指定的用户需要更高的特异性才能赢得该style元素,因此我建议为每个元素使用一个额外的类,以便用户可以覆盖默认值:
.foo.override { color: #0000FF; }
在所有情况下,您都希望仔细挑选您的选择器,以尽可能减少特异性.
Spu*_*ley 11
一般来说,如果你正在考虑使用!important,那么你很可能会考虑整理你的样式表.
!important 可以用来强制事物的行为,但大多数时候它是一个过于复杂的CSS的指标.
没有相反的!important(甚至没有分配重要性水平的能力),但如果存在,则可能适用相同的观点.
CSS规则以非常严格的优先顺序应用,如果您遵循如何应用CSS的最佳实践(即样式元素名称和类名优先于ID和内联样式),那么通常可以覆盖不求助的!important.
我发现我实际需要的唯一一次!important是我一直在处理样式表的地方,该样式表分层在CMS模板定义的现有样式之上,我没有任何控制权.
在您的情况下,您使用jQuery设置内联样式.如果你想获得斑点效果,这是一件非常好的事情.但是,为了执行一般样式,可以覆盖它,如果你在CSS中定义了这些样式,并使用jQuery添加或删除类名以便应用这些样式,那么你会更好.
这样您就可以将样式应用于元素组,但仍然可以根据需要覆盖它们.
希望有所帮助.