之前博客主题中的有序列表显示有点问题,列表标记位置会在正文左边突出一部分,所以设置了 padding
值来解决此问题:
1 2 3 |
.article-content ol { padding-left: 20px; } |
但有发现无序列表也有这个问题:
所以想当然的在之前的位置后面把 ul
标签加上:
1 2 3 |
.article-content ol, ul { padding-left: 20px; } |
然后就悲剧了,页面上其它位置的 ul
也 padding-left: 20px
了:
好久没写 css 了,百思不得其解,试过 .article-content > ol, ul
、.article-content section > ol, ul
都不行,甚至怀疑同级标签也有继承的关系。后来发现其它地方会把 class 标签写两次才恍然大悟,应该是逗号「,」优先级更高一点,把选择器解析成了 .article-content ol
和 ul
两部分,所以选择器写成 .article-content ol, .article-content ul
就可以了。
不用就会忘,随便改点东西就踩坑了。Orz!