HTML中当定义多个class属性时无效的解决方法介绍

代码如下:

<p id="p" class="middle_p padding_10"> 
<span id="s" class="normal_span"></span> 
</p>

我在两个class里设置的颜色不同，在middle_p里设置的是红色，在padding_10里设置绿色，

结果显示的是绿色，这给我的第一感觉就是：方向反了！

于是我把两个位置对换，还是绿色！！

这。。。。

难道是？？？

打开css文件一看，果然padding_10在middle_p 前面，然后我把他们俩位置对换，

刷新浏览器，红色！！！

所以呢，在定义多个class值的时候，一定要注意，把自己最喜欢的样式放在后面！
但是呢，如果你在padding_10前面加个p（假设父级元素是p），变成p.padding_10，然后你会发现，不管它在哪，我们的p p始终是绿色的，

从这个例子可以看出来，css样式的优先级是在加载css文件的时候就确定下来的，而不是由后来html里class属性位置前后决定的。

更多HTML中当定义多个class属性时无效的解决方法介绍相关文章请关注PHP中文网！