0

我对 Derobin 的 WMD 编辑器的实现有一个小问题。

它似乎没有正确格式化，我不完全确定为什么。虽然我不确定我是否应该在 Doctype 上问这个问题。

我使用的是 SO 参考中的降价文本示例，当然应该如下所示：

  1. 列表项中的列表：
    • 缩进四个空格。
      • 缩进八个空格。
    • 又是四个空格。

  2. 列表项中的多个段落：最好将段落缩进四个空格您可以使用三个空格，但是当您嵌套其他内容时会变得混乱。坚持四个。

    我们将第一行缩进了一个额外的空间以使其与这些段落对齐。在实际使用中，我们可能会对整个列表执行此操作，以便所有项目都排成一行。

    这一段仍然是列表项的一部分，但对人类来说看起来很乱。因此，最好手动包装嵌套段落，就像我们对前两个段落所做的那样。

  3. 列表项中的块引用：

跳过一行并缩进 > 的四个空格。

  1. 列表项中的预格式化文本：

    Skip a line and indent eight spaces.
That's four spaces for the list
and four to trigger the code block.

但是，我得到的看起来像这样：

问题示例

我认为这是与 CSS 相关的，但我看不出是什么原因造成的。如果需要，我可以发布 CSS，但我可能会发布所有内容，因为我不确定是什么原因造成的。但是，我不确定它是否可能是实际的脚本本身（由于示例有效，我发现这很可疑，我只是复制了相同的确切代码）。

我还应该指出，下载 WMD 附带的示例本身可以正常工作，但是一旦我将其添加到我的应用程序中，就会出现上述情况。

我还应该补充一点，这个问题在 IE7/8 和 Firefox 3.5 中一直存在。

任何帮助深表感谢。

编辑：通过为 list-style-position: inside 添加 ol 和 ul 的 CSS 样式解决了出现在框外的项目符号/数字；但其余的仍然保持不变。

编辑：根据用户评论进行编辑。正在输出的 HTML 是：

<ol>
<li>Lists in a list item:
<ul><li>Indented four spaces.
<ul><li>indented eight spaces.</li></ul></li>
<li>Four spaces again.</li></ul></li>
<li><p>Multiple paragraphs in a list items:
It's best to indent the paragraphs four spaces
You can get away with three, but it can get
confusing when you nest other things.
Stick to four.</p>

<p>We indented the first line an extra space to align
it with these paragraphs.  In real use, we might do
that to the entire list so that all items line up.</p>

<p>This paragraph is still part of the list item, but it looks messy to humans. So it's a good idea to wrap your nested paragraphs manually, as we did with the first two.</p></li>
<li><p>Blockquotes in a list item:</p></li>
</ol>

<blockquote>
<p>Skip a line and
indent the >'s four spaces.</p>
</blockquote>

<ol>
<li><p>Preformatted text in a list item:</p>

<pre><code>Skip a line and indent eight spaces.
That's four spaces for the list
and four to trigger the code block.
</code></pre></li>
</ol>
4

1 回答 1

2

在你的css文件中你有这个：

* {
    margin:0;
    padding:0;
}

这是一个通用重置，可以从所有内容中删除填充和边距。正如我在 Doctype.com 上所说的那样。

您将需要删除它，并使用更可控的重置，或为 ul 和 li 设置一些默认填充和边距。

由于每个浏览器似乎都有不同的 ul 默认值，我倾向于从我的重置中忽略它们并专门设置 nav ul。

这是我使用的重置：

div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
    }

它重置了列表以外的几乎所有内容。

于 2009-10-07T11:13:59.937 回答