締切済み

Web2.0において　サイドの影のつけ方

2007/03/24 18:03

こんにちは。はじめまして。いまだに中学生の未熟者ですが、質問があるので投稿いたします。 Web2.0風を目指してサイト制作をしています。そこで質問があります。先月ネットサーフィンをしていて見つけたサイトなのですが http://retorotype.blog78.fc2.com/ こちらのサイトの両サイドにある影のようなバーはどのようにすれば取り付けれるのでしょうか？まだまだ未熟者なのですが、画像を使用しているものだと思うのですがその設定がいまいちよくわかりません。検索などで調べてみたのですが、答えがだせない現状です。 HTMLとCSSに関する知識は未熟相当なものですが、あります。どなたか、もしご存知の方がいらっしゃいましたらお答え願いします。愚問申し訳ございません。よろしくお願いいたします。

zetsu_info
お礼率0% (0/15)

CSS
回答数4
ありがとう数1

みんなの回答 （4）
専門家の回答

みんなの回答

noro6677
ベストアンサー率21% (34/158)

2007/03/25 19:34 回答No.4

画像を使う。 >Web2.0風を目指してサイト制作をしています。こんなものWeb2.0風でも何でもないですよ。 Web2.0がなにか学びましょう。

ログインすると、全ての回答が全文表示されます。

cc_sakura
ベストアンサー率0% (0/1)

2007/03/25 02:20 回答No.3

こんにちは。 http://retorotype.blog78.fc2.com/ このサイトのソースを見てください。 BODYタグ以下の一番外側を<div id="container"></div>で囲っています。そこが影の内側で771pxになっています。そして、CSSでBODYタグに適用させているイメージが779pxです。これを真ん中に表示させて縦方向にリピートさせています。画像を見ると、左右4pxに色が付いていると思います。（これが影になる）左右4px以外の白い部分は771pxの<div id="container"></div>の内容が入りますので、上手く779px-771px=8pxで左右に4pxの影がつきます。つまり、本文を書く枠より幅が拾い、左右を黒白でグラデーションした画像を用意すれば影をつけられます。高さはリピートするので1pxで十分です。詳しいコードは「http://retorotype.blog78.fc2.com/」を参考にすれば分かると思います。