1

私は<a>背景を持っています:

 <a class="link" href="/#/index"></a>

そしてそれcssのために:

.link
{
  display: block;
  width: 50px;
  height: 50px;
  float: left;
  text-indent: -9999px;
  background:  #fff url("/logo.png") no-repeat;
}

画像は正常に表示されますが、リンクが機能しません。画像カーソルにカーソルを合わせると、ポインターではなくデフォルトであり、クリックしてもページが更新されません。

4

4 に答える 4

0

css クラスは を参照して.homeいますが、リンクには のクラスがありlinkます。

編集:

画像が適切に表示されると言ったことに気付きました(そして、質問のクラスをすでに編集しています)。

ただし、jsFiddle.net で css とリンクを試してみましたが、うまくいきました。

編集2:

意味的に言えば、空のリンク ( &nbsp;. 実際の画像を使用していないため、alt タグに頼ることはできないため、リンク内に説明テキストを追加してから、次のように非表示にする必要があります。

HTML:

<a class="link" href="/#/index">This is my text</a>

CSS:

.link
{
  display: block;
  width: 50px;
  height: 50px;
  float: left;
  text-indent: -9999px;
  background:  #fff url("/logo.png") no-repeat;
  text-align:left;
  text-indent:-999em;
  overflow:hidden;
}

テキストのインデントは、左側のテキストを削除すると同時に、テキストが表示されoverflow:hiddenないようにし、リンクのクリック可能な領域が左側にはみ出さないようにします。

于 2013-05-10T10:36:42.770 に答える