1

使用 HTML 等

<code style="background-color: #FFFFD9">
some block
of code
</code>

是否可以将背景颜色扩展到页面的右侧(而不仅仅是文本所在的位置)?

我不想使用 <div> 因为代码块嵌套在 <ul> 或 <ol> 所以我想在任何缩进级别保留代码块左侧的空白因为列表。

4

3 回答 3

1

还有另一种可能的样式:

<code style="display:block; white-space:pre; width:100%; background-color: #FFFFD9;">
some block
of code
</code>
于 2013-05-15T19:10:08.220 回答
0

我们可能需要查看更多的标记和 CSS,但是您是否尝试过简单地将 设置width为 100%?

code { background: #ffffd9; width: 100%; }
于 2013-05-11T16:16:41.457 回答
-1

我发现答案是将 <code> 放在只有一个单元格的表格中。然后可以为表格指定 CSS,使其具有 100% 宽度、无边距、边框填充等。

这使放置代码块的 <ol><li><ul><li> 的左侧缩进保持白色。彩色背景然后延伸到右侧。

CSS:

.tablecodeblock, .tablecodeblock td {width: 100%; border: 0; padding: 0; margin: 0}
.tablecodeblock td {background-color: #FFFFD9}

HTML:

<table class="tablecodeblock"><tr><td><code><xmp>Some block
of code</xmp></code>
</td></tr></table>
于 2013-05-11T19:14:44.273 回答