0
ul {
  list-style-type: none;
  padding: 0px 5px 0px 5px;
  margin: 0px;
}

ul li {
  border-bottom: 1px solid #B9D3EE;
}

ul li a:link,
ul li a:visited,
ul li a:active {
  width: 100%;
  color: blue;
}

ul li a: hover {
  width: 100%;
  color: #ffffff;
  background-color: #B9D3EE;
}

IEでは、上記のコードにカーソルを合わせると、セル全体が強調表示されます。ただし、FFでは、その中にあるリンクのみが強調表示されます。 IEと同じように、FFでセル全体を強調表示したいと思います。

リストは次のとおりです。このリストの作成を開始したばかりで、この問題に気付いたときにテストを停止したため、最初のリンクのみが作成されていることに注意してください。

<ul>
  <li><a href="">beauty</a></li>
  <li>creative</li>
  <li>Info Tech. (IT)</li>
  <li>cycle</li>
  <li>event</li>
  <li>financial</li>
  <li>legal</li>
  <li>lessons</li>
  <li>medical</li>
  <li>marine</li>
  <li>pet</li>
  <li>automotive</li>
  <li>farm+garden</li>
  <li>household</li>
  <li>labor/move</li>
  <li>MKT/COMM</li>
  <li>office</li>
  <li>skill'd trade</li>
  <li>real estate</li>
  <li>health/wellness</li>
  <li>travel/vac</li>
  <li>write/ed/tr8</li>
</ul>

どんな助けでも大歓迎です!

4

2 に答える 2

1

a要素をブロック要素として作成できるため、親要素のすべての幅を取得できます(デモ:http: //jsfiddle.net/WasWE/)。

ul li a:link, ul li a:visited, ul li a:active {
  display: block;
  color: blue;
}

ul li a:hover {
  background-color: #B9D3EE;
  color: #ffffff;
}​

hoverまたは、要素にイベントを追加することもできますli(デモ:http://jsfiddle.net/XmwTV/):

ul li:hover {
  background-color: #B9D3EE;
}

ul li a:link, ul li a:visited, ul li a:active {
  color: blue;
}

ul li a:hover {
  color: #ffffff;
}
于 2012-09-07T04:02:24.873 に答える
-1

こんにちは今あなたのcssで削除with 100%し、あなたのcssanchor link定義display blockしますanchor

このように

ul li a: link,
ul li a: visited,
ul li a: active {

display:block; // add this line
width:100%; // remove this line

  color: blue
}

ul li a:hover{
width:100%; //remove this line
  color: #ffffff;
  background-color: #B9D3EE;
}

デモ

于 2012-09-07T04:10:16.390 に答える