[新着] Webテンプレートを仮オープンしました
line-break は、禁則処理を指定するプロパティです。
p {
line-break: strict;
}
| line-break | normal … (厳密な禁則処理を行いません)デフォルト |
|---|---|
| strict … (厳密な禁則処理を行います) |
【禁則処理について】
文章の読み易さや見た目を整えるために、括弧や句読点などが行頭や行末に来ることを回避するための処理です。
■行頭禁則文字の例 … 、 。 ) 」 々
■行末禁則文字の例 … ( 「
※normal を指定した場合でも、ある程度の禁則処理は行われているようです。
■strictを指定した場合の変化
簡単に検証してみたところ、strict を指定することで次のような変化がありました。
「ッ」や「ぃ」などの小さい文字、ー、…(他にもあるかもしれません)などの文字が行頭に来なくなりました。
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
p {
width: 50%;
border: 1px #c0c0c0 solid;
}
#example1 { line-break: normal; }
#example2 { line-break: strict; }
-->
</style>
</head>
<body>
<p id="example1">■normal<br>どの文字が禁則処理されるのかを ...</p>
<p id="example2">■strict<br>どの文字が禁則処理されるのかを ...</p>
</body>
</html>
▼これをブラウザで見ると次のように表示されます
■normal
どの文字が禁則処理されるのかをテストしてみます。ブラウザの幅を動かすことで、ノーマルと厳密の違いを確認することができます。全角(カッコ)のテスト、半角(カッコ)のテスト。次に「このカッコ」のテスト。ちぃさぃ文字のテストと、のばーーーすテスト。半角!と全角!のビックリマーク。次に"半角"と”全角”のダブルクォーテーション。云々とか我々とかの小さい「々」のテスト。例えば…とか・・・のテスト。最後に\5,000とか¥5,000とか100%とか100%のテスト。
■strict
どの文字が禁則処理されるのかをテストしてみます。ブラウザの幅を動かすことで、ノーマルと厳密の違いを確認することができます。全角(カッコ)のテスト、半角(カッコ)のテスト。次に「このカッコ」のテスト。ちぃさぃ文字のテストと、のばーーーすテスト。半角!と全角!のビックリマーク。次に"半角"と”全角”のダブルクォーテーション。云々とか我々とかの小さい「々」のテスト。例えば…とか・・・のテスト。最後に\5,000とか¥5,000とか100%とか100%のテスト。