Homepage Zero ガイド
logo

ゼロから始めよう!わかりやすい!ホームページ作成ガイド

初めての方へ|総合案内|お問い合わせ|当サイトについて

ホームページ初心者ガイド| HTML| CSS| ホームページお役立ち情報| ホームページレベルアップ情報| その他

ホームHTMLリファレンス(アルファベット検索)>text-autospaceプロパティ

CSSプロパティ辞典
タグ一覧(ABC順) 目的別タグ一覧 スタイルシート一覧(ABC順) 目的別スタイルシート一覧

text-autospace プロパティ …日本語などの表意文字と非表意文字の間との間隔を指定する

使用プロパティ

CSSプロパティ

text-autospace: 値;

対象となる
要素

すべて

継承

する

次項(値と働き)を参照

対応ブラウザ IE6 Win

解説

text-autospace プロパティを使えば、 日本語などの表意文字と、アルファベットなどの非表意文字の間に少しだけ隙間を入れるかどうかを指定できます。

text-underline-position プロパティは Internet Explorer 独自のプロパティです。

値と働き

働き 働き
none 隙間を入れない。 ideograph-alpha 表意文字と非表意文字の間に隙間を入れる。
ideograph-numeric 表意文字と数字の間に隙間を入れる。 ideograph-parenthesis 表意文字と半角カッコの間に隙間を入れる。
ideograph-space 表意文字と非表意文字の間に隙間を広めに入れる。

使用例

記述例
<html>
<head>
<title>HOME PAGE ZERO ガイド</title>


<!--スタイルシート-->
<style type="text/css">

p.sample1 {
font-size: 20px;
font-weight: bold;
text-autospace: none;
}

p.sample2 {
font-size: 20px;
font-weight: bold;
text-autospace: ideograph-alpha;
}

p.sample3 {
font-size: 20px;
font-weight: bold;
text-autospace: ideograph-numeric;
}

p.sample4 {
font-size: 20px;
font-weight: bold;
text-autospace: ideograph-parenthesis;
}

p.sample5 {
font-size: 20px;
font-weight: bold;
text-autospace: ideograph-space;
}

</style>

</head>

<!--ページの本文-->
<body>

<p class="sample1">-none-<br>
あaいbうcえdおe<br>
あ1い2う3え4お5<br>
あ(い)う(え)お(</p>

<p class="sample2">-ideograph-alpha-<br>
あaいbうcえdおe<br>
あ1い2う3え4お5<br>
あ(い)う(え)お(</p>

<p class="sample3">-ideograph-numeric-<br>
あaいbうcえdおe<br>
あ1い2う3え4お5<br>
あ(い)う(え)お(</p>

<p class="sample4">-ideograph-parenthesis-<br>
あaいbうcえdおe<br>
あ1い2う3え4お5<br>
あ(い)う(え)お(</p>

<p class="sample5">-ideograph-space-<br>
あaいbうcえdおe<br>
あ1い2う3え4お5<br>
あ(い)う(え)お(</p>


</body>
</html>
↓
[ブラウザでの表示例]
HOME PAGE ZERO ガイド

-none-
あaいbうcえdおe
あ1い2う3え4お5
あ(い)う(え)お(

-ideograph-alpha-
あaいbうcえdおe
あ1い2う3え4お5
あ(い)う(え)お(

-ideograph-numeric-
あaいbうcえdおe
あ1い2う3え4お5
あ(い)う(え)お(

-ideograph-parenthesis-
あaいbうcえdおe
あ1い2う3え4お5
あ(い)う(え)お(

-ideograph-space-
あaいbうcえdおe
あ1い2う3え4お5
あ(い)う(え)お(

関連情報ページ

ページトップへ

ホームページ初心者ガイド| HTML| CSS| ホームページお役立ち情報| ホームページレベルアップ情報| その他

<TOP>

logo
ゼロから始めよう!わかりやすい!ホームページ作成ガイド

|初めての方へ|総合案内|お問い合わせ|当サイトについて|

copyright (C) TOMIY All Right Reserved
inserted by FC2 system