【问题标题】:Inline pre formatting?内联预格式化?
【发布时间】:2011-08-22 01:33:24
【问题描述】:

这应该很容易,因为我忘记了如何在 Google 上找到它。

我该如何完成这样的事情:

废话废话some code废话废话

在wordpress中? pre 不起作用,因为它会换行。

【问题讨论】:

    标签: html wordpress


    【解决方案1】:

    使用<code><pre> 显示内联代码可能更好,原因有两个:

    • 它被视为内联
    • <code> 的语义比<pre> 匹配得多

    但一定要使用 CSS 类(正如@Blender 指出的那样)。

    有一个警告:<code> 不会转义 <> 括号,因此如果要显示 HTML,则必须手动将括号转义为 <>。 (无论如何你都应该这样做;HTML 中的标签确实应该与数据明确区分开来)

    【讨论】:

    • 另一个警告:<code> 折叠空白,当我尝试与人们讨论字符串中的重要空白时,这一直困扰着我。
    • @Andy 我想知道你是否可以用white-space: pre; 解决这个问题?
    • 可能,我最近不得不第一次在只读文本区域上使用它
    【解决方案2】:

    文本text

    等等... Wordpress?它支持哪些 HTML 标签?

    【讨论】:

    • 我不确定 OP 是如何编写这个的(通过 HTML 或 WYSIWYG 界面),但 Wordpress 支持 HTML。
    • <tt> 在 HTML5 中不受支持,请改用 CSS 或 <code>
    • 这个解决方案的问题是当预格式化文本包含控制字符如<时,除非你手动转义,否则它将被视为标签
    【解决方案3】:

    您可以通过在主题样式表中添加一些自定义 CSS 来获得内联 <pre>

    pre.inline {
       display: inline;
    }
    

    现在,当你写的时候:

    I am some <pre class="inline">code, see?</pre> Foo.
    

    显示如下:

    我是code, see?Foo。

    【讨论】:

    • 不错的解决方案,但仅适用于自托管的 wordpress,而不适用于 wordpress.com(除非进行高级升级)
    • @gerrytan &lt;pre style="display: inline;"&gt; 怎么样?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-08-10
    • 2012-10-17
    • 2017-10-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多