前回の縦に複数列のセルを使用すると、標準のままでは行間が広く開いてしまいます。たとえば、以下に示す文章を右寄せで表現してみたいと思います。 おみやげは
特に意味は無いのですが、あまりにも思い浮かばなかったので、どこかで見たフレーズにしてみました(笑)。無事故でいいのよ お父さん さて、右寄せにするためにはテーブルに右寄せの要素を加えてやるのですが、セル内の改行はテーブルの構文を無効にしてしまうため、セルを縦に並べて表記します。ところが、セル内の間隔が大きいために行間がかなり広くなってしまいます。それを示す例を以下に作ってみました。わかりやすくするために、セルに色を付けてます。
padding:☆ 縦横すべての間隔を指定します。 padding-top:☆ テキスト上部の間隔を指定します。 padding-bottom:☆ テキスト下部の間隔を指定します。 padding-left:☆ テキスト左側の間隔を指定します。 padding-right:☆ テキスト右側の間隔を指定します。 ☆：間隔の数値を指定します。☆pxなどがメジャーです。実際に、パディングを縦横全部の間隔を指定する「padding:0px」を設定して先ほどの川柳？を表記します。本文部分をこのように表記します。 ||<#ffcccc' style='width:560px;padding:0px;text-align:right' ``おみやげは
色つきだと、目の錯覚で間隔が広く見えてしまうので、セルの色を白くして消してやります。より実感的に思えるはずです。
さあ、このパディングの要素を応用すると、このようなこともできます。
ソースは以下のように記述します。 ||<#ffffff' ``|| ||<#ffffff' style='padding:0px' ``おみやげは セル背景色を白。 ||<#ffcccc' style='padding:0px' ``無事故でいいのよ セル背景色を薄いピンク。 ||<#ccccff' style='padding:0px' ``お父さん セル背景色を薄い青。 ||<#ffffff' ``||
これを応用して、背景は白のままテキストの色を変えてやることもできます。 次回はテキストの色、そして書体（フォント）を帰ることに挑戦してみましょう！ |
- >
- コンピュータとインターネット
- >
- インターネット
- >
- ホームページ
コメント（2）
