サイト内検索
...スタイルシート(css)...
スタイルシート・テキスト
下線の位置
- 下線の位置を表示するには、text-underline-positionプロパティを指定します。
- [メモ・・・W3C・CSS検証サービス・・・]
- text-underline-positionは、
- CSS レベル 2.1 に存在しませんが、[css3] に存在します。
- [使い方]
- p{
text-decoration: underline;
text-underline-position: above;
}
| プロパティ名 | 値 | 説明 |
|---|---|---|
| text-underline-position： | above; | 文字の上、または右側に線を表示します。 |
| below; | 文字の下、または左側に線を表示します。 |
縦書き
- 縦書きを表示するには、writing-modeプロパティを指定します。
- ＩＥのみに対応しています。
- [メモ・・・W3C・CSS検証サービス・・・]
- writing-mode は、
- CSS レベル 2.1 に存在しませんが、[css3] に存在します。
- [使い方]
- p{writing-mode: tb-rl;}
| プロパティ名 | 値 | 説明 |
|---|---|---|
| writing-mode： | tb-rl; | 縦書きにします。 |
| lr-tb; | 横書きにします。(標準値) |
サンプル
[ｈｅａｄの中]
<style type="text/css"><!--
.sample1{
text-decoration: underline;
text-underline-position: above;
}
.sample2{
text-decoration: underline;
text-underline-position: below;
}
p.sam{
writing-mode: tb-rl;
white-space: nowrap;
font: 150%/80% serif;
}
-->
</style>
[ｂｏｄｙの中]
<span class="sample1">下線をつけます。</span><span class="sample2">上線をつけます。</span>
<p class="sam">
<span class="sample1">
縦書きにして
右側に線を入れました。
</span>
<span class="sample2">
縦書きにして
左側に線を入れました。
</span>
</p>
[ブラウザ上]
|
下線を上につけます。
下線を下につけます。
縦書きにして
|