4

'white-space:pre' と同じように pre(html タグ) がアクティブだと思っていました。しかし、そうではありません。

<pre>
aaa
bbb
</pre>

<p style="white-space:pre;">
aaa
bbb
</p>

<pre>最初と最後の を無視し\nます。ただし<p>、最初のものを保持し\n、最後のものは無視してください。なんで?

jsfiddle テスト

4

4 に答える 4

7

HTML標準には次のように記載されています。

注:HTML構文では、pre要素の開始タグの直後の先頭の改行文字が削除されます。

ここを読んでください:http ://www.whatwg.org/specs/web-apps/current-work/multipage/grouping-content.html#the-pre-element

したがって、<pre>要素にはこの特別なルールが含まれています。他の種類の要素にwhite-space:pre設定がある場合、そのルールは適用されないようです。

于 2012-08-24T19:12:19.647 に答える
1

<pre>-Tag はコンテンツを等幅フォントで表示します。これは、すべての文字が同じ幅であることを意味します。

で使用されるブラウザの標準フォントの代わりに読みやすくなってい<p style="white-space:pre;">ます。

于 2012-08-24T17:29:03.567 に答える
1

実際、それらは同じです。s の上にスペースを取得している理由<p>は、デフォルト<p>で段落を区別できるように、それ自体の上に空の行が追加されるためです。<pre>そうしないので、そこに余分なスペースはありません。

于 2012-08-24T17:29:13.080 に答える
0

HTMLpre要素とCSS設定white-space: preは、まったく別の構造です。2つを混同するのはカテゴリエラーです。しかし、あなたは改行に関してレンダリングの違いに言及しているようです。

仕様上、開始タグ直後の改行は無視しますので、

<pre>
aaa
bbb
</pre>

と同等である必要があります

<pre>aaa
bbb
</pre>

p代わりに使用しpreたり、スタイリングを追加したりしても、これはまったく変更されません。しかし、ブラウザは常にルールに従って動作するとは限りません。これはその1つのケースです。

それらは要素を異なる方法で処理するだけです。pre士気は、要素と同様に要素を使用することを避けるべきwhite-space: preであり、それらを使用した場合は、このバリエーションに注目し続けることです。必要に応じて、開始タグの直後に改行を入れずに、スペースと改行を続けます(先頭に空の行を入れたい場合)。

于 2012-08-24T19:13:29.650 に答える