本文へスキップ

ホームページビルダー16のCSS編集(12)

電話でのご予約・お問い合わせはTEL.03-1234-0000

〒163-0000 東京都○○区○○○1-2-3

コンセプトconcept

次の変更を行うとこんな風になった。あとはこれに合わせて文字を変えるだけ。
HTMLソースでid="hpb-inner"をid="hpb-inner2"に変更し、container_5Ea_2c_right.cssに次のコードを追加。
#hpb-inner2
{
position: relative;
padding-top: 0px;
padding-bottom: 0px;
width: 866px;
background-color: #F1F4FF;
margin-right: auto;
margin-left: auto;
clear: both;
}
これはhpb-innerから
background-image : url(bg_inner.png);
background-repeat: repeat-x;
background-position: 0px 18px;
を削除したもの。

次に
titleBg_5Ea.pngのサイズとデザインを変更した。
.hpb-layoutset-02 h2
{
background-image : url(titleBg_5Ea.png); サイズ変更とデザイン変更
background-position: right bottom;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: 0;
height: 70px;
text-align: left;
overflow: hidden;
line-height: 70px;
background-repeat: repeat-x;
}

titleBg_5Ea.png)5×47


この時、「Concept」の上に隙間があったので、余計なタグを削除した。


のファイル名はlogo_5Ea.png。これをCSSから削除するかファイルを削除すると消える。
次のページヘ

スタッフ写真

shop info.店舗情報

ビルダーサロン

〒163-0000
東京都○○区○○○1-2-3
TEL.03-1234-0000
FAX.03-1234-0001
→アクセス