<a class="li_a ui-link">xxx</a>
a链接有两个样式。ui-link中定义了 padding-left:30px;
li_a的样式中又定义了 padding-left:0px;
ui-link是jqmobile通过js添加的样式。 两个样式我都写在了同一个css文件里,且li_a的样式代码在后面。
按道理是应该li_a的paddin-left:0px显示的吧。 可为什么firebug里看到, li_a的 padding-left:0px 这个样式被划了一道横线? 横线什么意思? 难道表示被覆盖掉了?那也应该是前面的ui-link的设置被划横线才对吧?
------解决方案--------------------
li_a中定义的padding-left被覆盖了。class属性中设置多个样式时,优先级与顺序是相反的,写在后面的比写在前面的优先级要高。
------解决方案--------------------
楼主 ,看看 js生成的 ui-link 是不是 定义在 li_a 之后了,
或者 ui-link 是不是 有层次关系,这样优先级就比 li_a 高了。
在同级的选择器下(除行内样式),样式是根据在style中定义的顺序来决定的,后来居上。。。
参考下
- HTML code
<!DOCTYPE HTML> <html> <head> <meta charset="gb2312" /> <title></title> <style> .red { color:red; } .blue { color:blue; } </style> </head> <body> <div class="red blue">1111111</div> <div class="blue red">1111111</div> </body> </html>
------解决方案--------------------
代码是顺序执行的,后面设置的padding-left 会覆盖到前面设置的值