でん⚡きかいでんのブログ

3Dプリンター、3DCG、PC、電子工作、HTML、CSS、ミシン、ペンタブレット、アイデア・材料・道具の紹介。PCデータのわかりやすいバックアップ方法。PC関連機器の使用感レビューなど。

正当なCSSです! クリエイティブ・コモンズ・ライセンス表示

2015.02.13 [金]

word-break,word-wrap,white-space

単語・文字・文章の改行規則

 基本的に全て英語に対する指定であって、日本語に対して禁則を指定することはできない。
 日本語は単語の途中でも改行されて枠外に飛び出さないが、keep-all,pre,nowrap を指定した時だけは枠外に飛び出す。


word-break : ____ ;

枠内の改行方法の指定。

  • normal
    改行される。(デフォルト)
    (日本語は単語の途中であっても改行され、飛び出さない。)
    ただし長い英単語だと枠から飛び出す。
  • kepp-all
    1行が改行されず、枠外に飛び出す。
  • break-all
    枠内の改行は全て無視され、全て続けて表記されるが、単語の途中でも全て折り返されて枠外には飛び出さない。
  • loose
  • break-strict

word-wrap : ____ ;

 枠の中で単語が長すぎて収まらない場合、単語の途中でも改行するかどうかを指定する。
(どちらにせよ日本語は飛び出さない。)

  • normal
    単語が長くて収まり切らない場合、枠から飛び出す。(デフォルト)
  • break-word
    単語が長すぎて枠の端で収まらない時だけ、単語の途中で改行される。

white-space : ____ ;

 ソースコード中の改行、非改行規則の指定

  • normal
    連続した半角スペース、タブ、改行を、1つの半角スペースとして表示する。<br>は無視されるが、枠の端では自動改行される。
  • pre
    改行もスペースもソースコードに書かれたそのままを表示。<br>は使えるが、枠の端で自動改行はされず、1文が長ければ枠外へ飛び出す。
  • nowrap
    改行指定<br>は無視されて改行されず、1文が長ければ枠外へ飛び出す。
  • pre-wrap
    基本的にpre同様、半角スペース改行などソースコードがそのまま表示されるが、枠外へは飛び出さず、自動改行される。
  • pre-line
    基本的にnormal同様、連続した半角スペース、タブが1つの半角スペースとして表示され、枠の端で自動改行もされるが、<br>でも改行が可能。

関連記事

« NEW  | HOME |  OLD »

コメント

コメントの投稿


「コメント非表示」管理人しか閲覧できないコメントにする。

 | HOME |