-3

navbar からのリンクごとに異なる背景を作成するには?

たとえば、ある写真をホーム リンクの背景に、別の写真を About リンクの背景に、別の写真を Contact me リンクの背景にするとします。

これはCSSだけでできますか???

よろしくお願いします:)

4

1 に答える 1

3

リンクについて

実際にリンク自体の背景を意味する場合は、各リンクに css クラス名を適用し、個別にスタイルを設定します。例えば：

<ul>
    <li class="homeLink"><a href="home.html">Home</a></li>
    <li class="aboutLink"><a href="about.html">About</a></li>
    <li class="contactLink"><a href="contact.html">Contact</a></li>
</ul>

そしてあなたのスタイルシートで

.homeLink { background-image:url(/img/home.jpg); }
.aboutLink { background-image:url(/img/about.jpg); }
.contactLink { background-image:url(/img/contact.jpg); }

ページ用

ページの場合、CSS クラス名をリンクの代わりに body タグに適用します。

    <body class="homePage">...

または...または...

そしてあなたのスタイルシートで

.homePage { background-image:url(/img/home.jpg); }
.aboutPage { background-image:url(/img/about.jpg); }
.contactPage { background-image:url(/img/contact.jpg); }
于 2013-05-19T18:58:14.530 に答える