覆盖 CSS 样式
在我们所有页面使用的全局样式表中,有以下行:
ul { margin: 0; }
li { list-style-type: none; padding-bottom: 3px; }
因此,我的页面中的任何 ul 都会在 li 旁边没有光盘的情况下呈现。
但是,在特殊情况下,我需要在 li 旁边显示光盘。
我有一个带有“blog-post”类的 div,尽管下面的内容对我来说可以解决问题。
.blog_body ul { list-style-type: disc; }
.blog_body ol { list-style-type: decimal; }
然而这并不能解决问题。
因此,使用以下 HTML
<ul>
<li>Testing</li>
</ul>
<ol>
<li>Testing</li>
</ol>
结果片段:
Testing
1. Testing
li 中仍然没有光盘嵌套在 ul 中。 想知道如何让他们到达那里吗? 我的 CSS-fu 很弱......
In a global style sheet used across all of our pages sits the following line:
ul { margin: 0; }
li { list-style-type: none; padding-bottom: 3px; }
Therefore, any ul's inside my pages render with no discs next to li's.
However, in special cases, I need to display the disc next to a li.
I have a div with the class "blog-post" and though that the following would do the trick for me.
.blog_body ul { list-style-type: disc; }
.blog_body ol { list-style-type: decimal; }
However this isn't doing the trick.
So with the following snippet of HTML
<ul>
<li>Testing</li>
</ul>
<ol>
<li>Testing</li>
</ol>
Results with:
Testing
1. Testing
Still no disc in the li's nested in the ul's. Thoughts on how I can get them there? My CSS-fu is weak....
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
!important 不是必需的,因为特定于类的样式已经覆盖了全局样式。 问题是因为在全局样式中您将边距设置为零。 样式类型已正确呈现,但您只是看不到它。 这应该适合你:
!important is not necessary because class-specific styles override global styles already. The problem is because in the global style you set the margin to zero. The style type is being rendered correctly, but you just can't see it. This should work for you:
将此:更改
为:
Change this:
to this: