首先,我是不太懂 css 的。用 bootstrap 的时候, 有两个 class:
:用于支持响应式图片
:这个图片的效果我喜欢,
于是我就写成了:
发现图片具有了 class="img-thumbnail"的效果。
但我不是太明白,这样的写法,是不是相当于合并了两个 class?那冲突的地方怎么处理?
css 有权重,越精确权重越大,两个 class 如果权重一样,以在 css 文件中靠后位置的优先。
#1 楼 @Rei 我试过 class="img-thumbnail img-responsive " >和 class=" img-responsive img-thumbnail img-responsive " >的效果都是一样的,也就是说 img-thumbnail 的权重大,而 img-responsive 压根没起到作用,是这个意思吧?
额,你还需要看看这两个 class 的交集和差集吧,应该是两个 class 的交集的地方,权重决定采用那个,而差集的地方,相当于并集,就是样式的叠加。最好的办法应该是看看源代码中这个两个 class 的实现。
#2 楼 @u1378130755 如果精确度一样的话 你得看这两个 class 对应的源码在实际文件的行数 越靠后的生效
DevTools 看 Computed 样式可以看到具体是什么起的作用……
#5 楼 @Kabie 哇,学到了,
CSS 的权重计算规则挺变态的,可自行搜索 CSS Specificity
搞 RoR 的人到底是对前端有多么不了解?这是所有 CSS 入门里的第一课好么?