0

ナビゲーション バーがあり、ナビゲーション バーのドロップダウン要素がドロップする黒い div の下にあります。これは黒の div の主な機能ではありません。あくまでもデザインですが、なかなかの出来栄えです。ここで私が話していることを見ることができます: http://www.ecoloc.ro/interior/test/regeneration . 今、私がやりたいことは、ナビゲーション バーのメイン要素がホバーされるたびに、メイン要素とその下の黒い div の一部を覆うのに十分な大きさの画像が表示されることです。私が投稿したリンクで見ることができます。その黒いギャップに画像が必要です。これはできますか？

ありがとうございました！

4

2 に答える 2

2

<a>の内側の寸法を変更したり<li>、背景画像を設定したりできます。メイン メニューの単語を表示したくない場合は、':hover' に `text-indent: -9999px' を設定するだけです (画像置換テクニック)。

ホバー時に変更を設定し、ハウト時に通常に戻る最良の方法は、スタイルを使用してさまざまなクラスを作成することです。したがって、ホバー時に JavaScript を介してクラスを変更し、寸法を自動的に変更します。

于 2012-09-26T14:38:06.977 に答える
0

「サブメニュー」リストにはすでに絶対配置を使用しているため、少しの CSS でそれを行うことができるはずです。

目的background-image:のグラフィックを含むリスト要素に を指定しbackground-repeat: no-repeat、 を設定し、絶対値を設定して、リストを正しいコーナーにheight:再配置します。と を使用して、リスト要素を正しい位置に配置します。top:left:margin:padding:

- アップデート： -

次の簡単で汚い最初のスケッチを試して、アイデアが得られたかどうかを確認してください。

<ul id="media" style="position: absolute; top: 108px; left: 1018px; height: 35px; background-color: red; padding-left: 131px; padding-top: 35px; ">
        <li><a href="#" title="" data-description="starts here">presa</a></li>
        <li><a href="#" title="" data-description="starts here">video</a></li>
        <li><a href="#" title="" data-description="starts here">foto</a></li>
</ul>

サブメニューには、メイン メニュー エントリと黒いサブメニュー バーが含まれます。必要な領域を正確にカバーする画像を提供し、位置を微調整します。

于 2012-09-26T14:43:30.190 に答える