概要CSSプロパティ「white-space」によって、その要素内の「空白文字」をどのように扱うかを定義できます。空白文字とは「半角スペース」「タブ」「改行」などの総称です。hyphenを使って下さい。これらのプロパティはしばしば混同され、混乱の元になっています。取りうる値white-spaceプロパティの値によって「2つ以上の連続する空白文字をどのように取り扱うか」や、「文字列が要素の縁に到達した際に自動的に折り返すか」「改行コードで改行するか」の振る舞いの組み合わせを指定できます。「pre」は、英語の「preserve(保持する)」の頭文字3文字である事を念頭に置くと、振る舞いがイメージしやすいでしょう。説明normal2つ以上の空白文字は1つに統合されます。改行コードは他の空白文字と同様に扱われます。長い文字列が、要素の縁に到達すると、自動的に折り返し(改行)が発生します。nowrapnormalと同じように、連続する空白文字は1つに統合します。自動的な折り返しは発生しません。pre連続する空白文字は統合されず、そのまま保持されます。ソースの文字列内に存在する改行コードか、<br>タグによって改行されます。pre-wrap連続する空白文字は統合されず、そのまま保持されます。長い文字列が、要素の縁に到達すると、自動的に折り返し(改行)が発生します。pre-line連続する空白文字は統合されます。ソースの文字列内に存在する改行コードか、<br>タグによって改行されます。シンプルな表にまとめると、下記のようになります。改行コードの有効に関わらず、要素の最後の改行(改行コード、brタグ問わず)は無視される事に注意して下さい。pre」の値を取っています。normalはデフォルトの振る舞いです。連続する空白文字が1つに統合されます。改行コードはただの空白文字として取り扱います。nowrapは、連続する空白文字を1つに統合されます。改行コードはただの空白文字として取り扱います。preはすべての空白文字を保持します。改行コードで改行します。pre-lineはすべての空白文字を保持します。改行コードで改行します。pre-wrapは連続する空白文字を1つに統合します。改行コードで改行します。1)関連CSSプロパティwhite-spacetext-transformtext-shadowtext-overflowtext-decorationtext-decoration-styletext-decoration-linetext-decoration-colortext-align-lasttext-indenttext-align@ルール@keyframesUI関連cursoroutlineoutline-offsetoutline-widthoutline-styleoutline-colorカウンターcounter-incrementcounter-resetテーブル(表)テキスト関連white-spacetext-transformtext-shadowtext-overflowtext-decorationtext-decoration-styletext-decoration-linetext-decoration-colortext-align-lasttext-indenttext-alignフィルター効果filterフォーマットline-heightletter-spacingフォント@font-facefontfont-size-adjustfont-stretchfont-familyfont-sizefont-variantfont-stylefont-weightフレックスボックスフロートclipfloatclearボックスモデルwidthheightmin-widthmin-heightmax-widthmax-heightvisibilitybox-sizingoverflowoverflow-yoverflow-xマージンmarginmargin-topmargin-rightmargin-bottommargin-leftpaddingpadding-toppadding-rightpadding-bottompadding-leftメディアクエリ@mediaリストlist-style-imagelist-style-typelist-style-positionlist-style変形transitiontransition-timing-functiontransition-propertytransition-delaytransition-durationtransformtransform-styletransform-origin段組みcolumnscolumn-rule-stylecolumn-rule-widthcolumn-rule-colorcolumn-rulecolumn-spancolumn-fillcolumn-gapcolumn-widthcolumn-count罫線borderborder-styleborder-colorborder-widthborder-topborder-top-styleborder-top-colorborder-rightborder-top-widthborder-right-styleborder-right-colorborder-right-widthborder-bottomborder-bottom-styleborder-bottom-colorborder-bottom-widthborder-leftborder-left-styleborder-left-colorborder-left-widthborder-imageborder-image-sourceborder-image-widthborder-image-sliceborder-image-outsetborder-image-repeatborder-radiusborder-bottom-left-radiusborder-bottom-right-radiusborder-top-right-radiusborder-top-left-radius背景backgroundbackground-imagebackground-attachmentbackground-clipbackground-colorbackground-originbackground-repeatbackground-size色opacity色と透明度color装飾box-shadow記述法backface-visibilityvertical-alignuser-select配置displayrightlefttopbottompositionz-index「WWWクリエイターズ」は、より多くの人が開発とウェブを楽しむための目指したウェブサイトです。コマンドラインやgitなど、開発ビギナーのつまづきやすい部分を共有しています。})(jQuery);閉じる。