『 ３４ 構造編（１）Bトップページの作成-CSS編⑪テキストの行揃えを設定する 』

• <<前の記事へ

• ﾄｯﾌﾟﾍﾟｰｼﾞ/体験記TOP
• 
• 『　３４　』
  
• CSS目的別/プロパティ別
• 
• 行揃え/text-align

• ※[ ６ ] ＨＴＭＬ-構造編(1)B トップページの作成-CSS編
  
• ⑪テキストの行揃えを設定する

---

●ページの見本→日記一覧、サイトについて

ワードなどで同じみ。行揃えについてです。

行揃えプロパティ text-align

特殊な場合を除いて初期値は左揃えです。

上記例の揃えた
い場所にleft等
記述します。

■■■■■■■

仲間だいすけ(ＤＡＩ)のＨＰ制作過程例

■■■■■■■
【値の設定例】

・左揃え→left
・中央→center
・右揃え→right

見本として日記一覧やサイトについてで右揃えをしてみた仲間だいすけでした(^^)

このページ『　３４　』のトップ

応用

【Internet Explorer5.5以下のバグ発生を利用するレイアウト】

Internet Explorer5.5以下では
中央揃え(center)のようなtext-alignプロパティの指定が子ボックスに継承され子ボックス全体が中央揃えになります。

上記バグを利用したレイアウト
階段のようなボックスレイアウトの手法

p#daisukenakamabaglayout
{ width： 320px； padding： 18px；
background-color： #FFB6C1；　
bordeｒ： 6px solid #CD5C5C； }
.daisukenakamaiebagparent { text-align： center；　｝←親ボックス
.daisukenakamaiebagchild　｛ text-align： left；　｝←子ボックス

※子ボックスの内容を中央揃えにしたくない場合
→子ボックスのtext-alignプロパティ値のみ左揃え（left）にする

このページ『　３４　』のトップ

まとめ

●発想を転換したレイアウト

このページ『　３４　』のトップ

• <<前の記事へ