6

これがHTMLです。かなり簡単です。

<script>hljs.initHighlightingOnLoad();</script>
<div class="container">
    <section>
        <pre>
            <code>
                function() {
                    console.log("test");
                }
            </code>
        </pre>
    </section>
</div>

そして、いくつかのCSSを試しましたが、何も変わりませんでした:

code {
    text-align: left;
}
pre {
    padding-top: 0;
    padding-bottom: 0;
}

この fiddleでどのように見えるかを確認できます。左側のコードが欲しいのですが、上部<pre>との間の巨大なパディングは何<code>ですか? ありがとう!
更新: これは動作するバージョンですが、HTML は見栄えがよくありません。誰かがより良いアイデアを持っていますか?

4

1 に答える 1

11

これはpreタグのせいです。指定されたコンテンツをフォーマット済みとして受け取ります。これは、タブとスペースがドキュメントで使用されている方法で表示されることを意味します。JS コードの前にあるタブとスペースを削除すると、正常に動作します。

<pre>
// code example goes here without any indentation
</pre>
于 2014-06-19T20:02:16.203 に答える