dポイントプレゼントキャンペーン実施中!

久しぶりにHTMLをいじってたんですが、すっかり忘れちゃって
色々見てみたんですが、解決しなかったので教えて下さい。

indexと同じディレクトリにdesignというフォルダを作り中にmouse_over.cssという
カスケードスタイルシートを作りました。
"mouse_over.css"の内容は
a:link.link1{
width:100px;
height:25px;
background-image:url(./pic/home.png);
}
a:hover.link1{
width:100px;
height:25px;
background-image:url(./pic/home_over.png);
}

です。それと、上同ディレクトリにpicというフォルダを作り、homeとhome_overという2種類の画像を入れてあります。indexには、head内に
<link rel="stylesheet" type="text/css" href="design/mouse_over.css" />というリンクを張り、
body内に<a href="リンク先URL" class="link1"></a>としましたが、画像が出ません。

上記のCSSをindex内に<style>括りで書くと、画像も表示されちゃんとマウスオーバーで
画像が変わるのですが、CSSを別に置くとindexは真っ白のまま何も表示されません。

何処が間違っているのかかなり色々やったのですが、まったくわからなくなってしまい、
困っております。

どうか智恵をお貸し下さい。宜しくお願いします。

A 回答 (2件)

No.1です。



HTMLファイルがあるディレクトリの中に、designとpicがあるということでいいですか?
──htmlファイル
├─design─CSSファイル
└─pic─画像ファイル

それなら、
background-image:url(./pic/~
とあるところを、
background-image:url(../pic/~
にすれば、いいと思います。
    • good
    • 0
この回答へのお礼

有難う御座います。書いて下さった方法で、表示され、すっきりしました。
有難う御座いました。

お礼日時:2014/03/15 08:55

CSSでURLを相対パスで指定するときは、HTMLファイルからではなく、CSSファイルからの相対パスになります。


ディレクトリの位置は大丈夫ですか?

http://www.htmq.com/csskihon/012.shtml

この回答への補足

自分が、質問させてもらった際に書いたのが、たぶん、
この、htmlと、cssに関する部分の、全文だと思うんですが、
具体的に、どこどの様に訂正するのか、教えて下さい。

補足日時:2014/03/15 04:30
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!