0

再利用可能なコンポーネントのドキュメントを作成しています。ドキュメントページには、コンポーネントのデモと、コンポーネントを再作成する方法のドキュメントが含まれます。たとえば、私はこのHTMLをデモンストレーションしている可能性があります。

<div class="top-level">
    <p>Hello</p>
</div>

これはこのCSSを持っています：

.top-level { background: red; }

さて、それを作成して再作成する方法を文書化したものを脇に置きたいと思います。

<aside>
    <p>All top level content goes into a div with a class of "top-level:</p>
    <code><div class="top-level"></div></code>
</aside>

問題は、「code」タグ間のテキストがdiv.top-levelのスタイルをまだ取得していることです。単純にコードとして表示したいのですが。私はすべてを上書きできると確信していますが、もっとエレガントな解決策を知っている人はいますか？

ありがとう！

4

1 に答える 1

0

Webページに表示されるコードは、<code>要素内に配置する必要があります。通常、要素のコンテンツは、<code>ほとんどのプログラミングブックのコードと同様に、等幅フォントで表示されます。

ただし、タグをhtmlとしてレンダリングしたくないことをブラウザが認識していることを、<and >（&lt;、 ）からエスケープする必要があります。&gt;

<code>タグ間の正しい表現は&lt;div class="top-level"&gt;&lt;/div&gtです。

于 2013-01-28T20:22:27.790 に答える