text-autospaceプロパティの説明
CSSのtext-autospace
プロパティは、Internet Explorerが独自に採用したもので、日本語・中国語・韓国語などの表意文字と、アルファベットなどの非表意文字・数字との間隔を指定する際に使用します。しかしその実態は不明確で、IEで実際に試してみてもこのプロパティ単体では反映されないようです。
text-autospaceに与えられる値
none
- 間隔は空けません。
ideograph-alpha
- 表意文字と、アルファベットなどの非表意文字の境い目に間隔を空けます。
ideograph-numeric
- 表意文字と、数字との境い目に間隔を空けます。
ideograph-parenthesis
- 表意文字と、半角の(括弧)との境い目に間隔を空けます。
ideograph-space
- 表意文字と、アルファベットなどの非表意文字との境い目の間隔を広めに空けます。
text-autospaceの使用サンプル
<div class="text_sample01">
text_sample01 [text-autospace: ideograph-alpha;]<br />
text sample. text sample. text sample.<br />
テキストサンプル、テキストサンプル。<br />
</div>
<div class="text_sample02">
text_sample02 [text-autospace: ideograph-numeric;]<br />
text sample. text sample. text sample.<br />
テキストサンプル、テキストサンプル。<br />
</div>
<div class="text_sample03">
text_sample03 [text-autospace: ideograph-parenthesis;]<br />
text sample. text sample. text sample.<br />
テキストサンプル、テキストサンプル。<br />
</div>
<div class="text_sample04">
text_sample04 [text-autospace: ideograph-space;]<br />
text sample. text sample. text sample.<br />
テキストサンプル、テキストサンプル。<br />
</div>
.text_sample01 {
text-autospace: ideograph-alpha;
background-color: #EEEEEE;
padding:5px;
margin:0px 0px 10px 0px;
}
.text_sample02 {
text-autospace: ideograph-numeric;
background-color: #EEEEEE;
padding:5px;
margin:0px 0px 10px 0px;
}
.text_sample03 {
text-autospace: ideograph-parenthesis;
background-color: #EEEEEE;
padding:5px;
margin:0px 0px 10px 0px;
}
.text_sample04 {
text-autospace: ideograph-space;
background-color: #EEEEEE;
padding:5px;
}