カーショップビクトリー

ようこそ高知県のカーショップビクトリーへ。お車のことならなんでもおまかせください。

 0880-34-0148

タップで電話をおかけいただけます

IT*その他

ホームページのテーブルに影をつける

2011/11/26

自分で作ったテンプレートに影をつけることができた!


このサイトのことではありませんが、
なんか、1カラムのテンプレートで、いまいち気に入ったのがなくて、
自分で作ろうと思って、
それに影をつけたい、と思ったので、
自分の覚書として、書きます。

あ、専門用語は使いません、
じゃなくて、使えませんので、よろしく。


ホームページ・ビルダーを使って、
ホームページに影って、どうやってるんだろう?
と、いろいろ調べました。


で、スタイルシート、CSSの記述でできることが判明。

ホームページビルダーでCSSって、どうやるんだろう?
そう思ったら、
普通に、リンクとか、マウスが上にあるリンクとか、
CSSで作ったら、ページのソースに、
+++++++++++++++++++++++
<STYLE type="text/css">
<!--

○○○

-->
</STYLE>
+++++++++++++++++++++++
※< > は小文字に直してください


という記述ができていたので、
あ~1ページごとだったら、
ホームページビルダーでも、CSSが書けるんだ!って思ったの。


で、そこに、調べたタグを書く。

+++++++++++++++++++++++
#content {
background: url(画像のアドレス) repeat-y; margin: 0 auto;
width: 920px;
}
+++++++++++++++++++++++

(920pxは、幅なので、テーブルの大きさで変わりますよ)

いろいろ、調べて、上のタグが、Firefoxファイヤーフォックスでは、
きちんと反映した。


で、IEを見てみたところ、
は?
左寄せになってる…(-_-メ)

なんで? margin: 0 auto;やんかぁ!!

で、また調べて、


+++++++++++++++++++++++
body {
margin: 0px;
padding: 0px;
text-align: center;
}
+++++++++++++++++++++++

これを入れたら、
おおっ!
\( ̄ー\)(/ー ̄)/ できたがな


CSSはそれぞれを、

<div id="content">
<div id="body">

divであててやって、
</div></div>

と、くくってやること。

FirefoxとIEは、ほんとうに見え方が違うときがあります。
Firefoxのほうが、ブラウザをキレイに整頓してくれる感じで、
ちょっとタグ書き間違っても、くずれにくいですね。


ほかにも、使い方全般で、ほとんど私はFirefoxで見ます。
IEの次に人気のブラウザですね。


※私の覚書ページです。
※影画像の設定は、独自で調べたり、画像は独自で作成してください。


ホームページ・ビルダー15 通常版 バリューパック

アクアス、今現在は シリウス「SIRIUS」もありますが、
やっぱり、使いやすいのは、ホームページ・ビルダーです。


HTML5+CSS3で作る 魅せるiPhoneサイト iPhone/iPad/iPod touch対応  CSS3 スタンダード・デザインガイド   できるホームページ HTML&CSS入門 Windows 7/Vista/XP対応

 


-IT*その他
-, , , ,