作者philxiao (Sting)
看板Blog
标题[Blogger] CSS优先顺序的问题（赠P币）
时间Sun Oct 14 01:52:08 2012
我在修改Blogger的CSS时，遇到一个「修先顺序」的问题，
据我所知，CSS有重复时，最高优先到最低优先的次序是：
Inline > Embedded > Linked
但是我在Blogger范本的「编辑html」功能，修改CSS，加入Embedded CSS的时候，
却无法附盖Linked CSS的效果（Linked CSS来源：
http://www.blogger.com/static/v1/widgets/4219271310-widget_css_2_bundle.css）
详请可参考图
http://i.imgur.com/OHE5t.png（Chrome Developer Tools）
可见到我写的Embedded CSS被划线，无法呈现效果（35px），而是呈现Linked CSS的15px
我有嚐试试过加入!important在Embedded CSS，的确有效果（35px）；
但是我还是
想弄清楚为什麽会造成这样的优先次序？
如果能获得合理的相关解答，将致赠微薄P币作为感谢～
再次谢谢！
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 114.24.0.132
※ 编辑: philxiao 来自: 114.24.0.132 (10/14 01:53)
1F：→ Wcw5504:顺序的问题？有可能是你把内嵌CSS写在<link 前面了 10/14 03:51
2F：→ Wcw5504:导致自订CSS被覆盖 不过这也只是猜测 没有实际页面可参照 10/14 03:52
Embedded CSS在Link CSS前面，实际检视原始码如下：
<head>
<title></title>
...
<link type='text/css' rel='stylesheet'
href='//www.blogger.com/static/v1/widgets/4219271310-widget_css_2_bundle.css'
/>
...
<style id='page-skin-1' type='text/css'><!--
.column-right-inner {padding: 0 35px;}
...
--></style>
</head>
※ 编辑: philxiao 来自: 114.24.0.132 (10/14 10:22)
3F：推 Wcw5504:外连的CSS中，选择器写得比较详细 限定了在main-inner之下 10/14 12:40
4F：→ Wcw5504:所以顺位比较高 你把自订的CSS也指定成一样的形式就可以了 10/14 12:41
5F：→ Wcw5504:.main-inner .column-right-inner {padding: 0 35px} 10/14 12:41
6F：→ Wcw5504:用上面这个应该就OK 10/14 12:41
7F：→ philxiao:谢谢Wcw5504 的确是这个问题，感谢你的教学，已致赠P币！ 10/21 03:17