我在有序列表中显示代码,以便它显示行号。每个 li
都有一个 pre
标签,其中填充了一行代码。
我的问题是,当我设置 ol
的宽度并允许溢出滚动时,溢出的背景颜色与最初显示区域的背景颜色不同。
ol
的背景颜色必须与 li
的背景颜色不同,以使行号突出显示。
我的 CSS 有问题吗,为什么会这样?如何为行号和代码设置滚动条和不同的背景颜色?
HTML:
<ol class="code">
<li>
<pre>Hello World! This is a long line that you have to scroll to see.</pre>
</li>
<li>
<pre>This is the second line that you have to scroll to see.</pre>
</li>
</ol>
CSS:
ol {
width:200px;
background-color:#CFCFCF; }
pre {
color:#FFF;
background-color:#000; }
.code {
overflow:scroll; }
问题:
最佳答案
这是正确的行为。这是因为当文本溢出元素(在本例中为 pre
)时,框不会随之增长。
关于html - 在我的 LI 中,为什么溢出的 bg 颜色与其余部分的 bg 颜色不同?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3741137/