縦の枠線を影を付けた画像で作るには？

質問

現在、HTMLのみを使って
ホームページを公開しています。
今回、ページのデザインを変えようと思ってます。

イメージ的には、
福岡ソフトバンクホークスのサイト
http://www.softbankhawks.co.jp/
の様なデザインにしたいです。

このホークスのサイトの、
縦の影の付いた枠線の作り方が分かりません。

ソースを見て、自分では、
この影の付いた縦線は短い画像で出来ており、
それを連続して表示しているのではと推測しました。
それ以上、自分では全く分かりません。

この枠線の作り方がお分かりの方
是非ご指南下さい。
よろしくお願いいたします。

回答No.2

STICKY2006 · ベストアンサー

>>スタイルシートの記述はソースを見ても表示されない場合もありますよね？

ファイル→名前をつけて保存
で「Ｗｅｂページの完全保存」を選択して保存してやればそのページを構成しているファイルが全て保存できます。

その中に、css、jsなど入ってましたので確認できるかと思いますよ。

お礼

再度のご返答ありがとうございます。全てのファイルが保存出来るのですね。保存後にWEB作製ソフトと通してソースと表示画面を見て、よく勉強してみます。

回答No.1

STICKY2006

こんちくは。

>>影の付いた縦線は短い画像で出来ており
まぁ、お察しの通り。
枠線の影の上にカーソル合わせて右クリックすれば画像として保存できます。

それを、HPで使用されている、上下左右分作りそれを連続表示させて影のように見せています。

>>それ以上、自分ではまったく分かりません。
といわれても、説明も難しく。。。

自分のPC内にページを保存して、使用されてるファイルの解析をしなきゃどうなってるか分からないかと思いますのであしからず。。。

参考までに。。。
スタイルシート内にクラス定義がされており、テーブル内でそのクラスを使用する事によって画像を連続表示させるようになっています。

とりあえず。。。
ホークスのTOPページを自分のパソコン内に保存して、使われているファイルの中身の、スタイルシートとソースをてらしあわせて見てください。

お礼

早速のご回答ありがとうございました。自分のPC内への取り込みをやってみます。スタイルシートの記述はソースを見ても表示されない場合もありますよね？