アフィリエイト広告を利用しています

広告

posted by fanblog

2015年11月21日

【CSS】画面表示の際に改行されない時の対処法


DBからHTMLで画面に表示させるとき、
div要素が邪魔したりでうまく改行されていない・・・
DBでは改行されているのに・・・ということがあったので、メモ。

・CSSのwhite-spaceプロパティを使う!!
white-spaceプロパティは、ソース中の半角スペース・タブ・改行の表示の仕方を指定する際に使用します。
自分の場合は、ソース内で改行されないという問題があったので、
pre-lineを指定してやると改行されるようになりました。


white-spaceに与えられる値は以下。

white-space: normal;


通常と同様、ソース中の連続する半角スペース・タブ・改行を、1つの半角スペースとして表示。
ボックスの大きさが指定されている場合には、その大きさに応じて自動的改行。

white-space: pre;


ソース中の連続する半角スペース・タブ・改行を、そのまま表示。

white-space: nowrap;


ソース中の連続する半角スペース・タブ・改行を、1つの半角スペースとして表示。
ボックスの大きさが指定されている場合にも、自動的改行されない。

white-space: pre-wrap;


[pre]同様に、ソース中の連続する半角スペース・タブ・改行を、そのまま表示。
ただし、要素の端まで行くと自動的に改行。

white-space: pre-line


[normal]と同様ですが、ソース内の改行位置でも改行される。





posted by newprogramer at 21:51| Comment(0) | TrackBack(0) | CSS
この記事へのコメント
コメントを書く

お名前:

メールアドレス:


ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。

この記事へのトラックバックURL
https://fanblogs.jp/tb/4440443
※ブログオーナーが承認したトラックバックのみ表示されます。

この記事へのトラックバック
検索
カテゴリーアーカイブ

最新記事
×

この広告は30日以上新しい記事の更新がないブログに表示されております。