HTML / CSS-特定の要素の空白を保持するためのベストプラクティスですか？
HTMLで空白を保持するbestの方法は何ですか？データベースからデータを取得する多くのページがあり、データには複数のスペースが含まれる場合があります。データを保持するレンダリングされたHTML要素は、アンカータグ(<a>), spans (<span>), table rows (<tr>, <td>, etc.
現時点で最も簡単なことは、次のようなグローバルcssクラスを追加することです。
body a, span, tr, td { white-space: pre; }
これを実装するより良い方法があるのだろうかwithout個々のHTML要素にクラスを割り当てる。
私は同じテクニックを使用しますが、必要なデータクラスラッパー内で：
.data a, .data span, .data tr, .data td { white-space: pre; }
HTML：
<div class="data">
....
</div>
<pre>no need for style</pre>
スペースをnbspに置き換えることの何が問題になっていますか？これは、任意の要素内で機能し、レンダリングされた出力のスペースを保持する必要があります。
これは、特定の要素でall whitespaceを保持するかどうか、およびそこで何が起こるかによって異なります。干渉する可能性のあるCSSルールがないと仮定すると、CSSは
a, span, tr { white-space: pre; }
a要素は常にbodyおよびtd内にあるため、デフォルトではtrからプロパティを継承します。
固定分割を行に強制するのではなく、複数のスペースの折りたたみのみを防止する場合は、white-space: pre-wrapまたはスペースを改行なしスペースに置き換える方が適切です。
最後に、選択された要素にルールを制限する必要性と可能性は、選択の方法に大きく依存します。おそらく、関連する部分を囲むいくつかの要素にwhite-spaceからpre（またはpre-wrap）を選択的に設定できます。内部要素に設定されていない場合は、プロパティが継承されることを忘れないでください.
継承を解除することもできます。たとえば、コンテンツのmostにルールを適用する場合は、table要素にwhite-space: preを設定できます。 white-space: normal適用されない行またはセル。