1

例えば、

a:hover {
    color: black;
    background:url("images/nav-hm.png");
}

ホバー時に表示される背景画像は、画像が長方形でなくても、リンクの周りの長方形のボックスで常に囲まれています。

長方形のボックスエンクロージャーを取り外す方法はありますか？

前もって感謝します

アップデート

背景画像に使用するつもりの画像-画像 画像は実際には雲の切り抜かれた画像です。ホバーするとクラウドが完全に表示されるようにします。

背景画像の幅と高さを一致させても、完全には表示されません。これが表示されているものです。 Image2

使用する実際の画像に一致するように幅と高さを調整した後のコード

a:hover {
  color: black;
  background:url("images/Untitled-2-2.png");
  width:337px;
  height:292px;
  }
4

2 に答える 2

0

a要素が長方形 (または長方形っぽい、複数の行にまたがる方法を考えてください) の場合、その背景は長方形です。形状に応じて、 で外観を変更しborder-radiusたり、代わりに の特定のレンダリングを選択したりできますtext-shadow。達成しようとしているもののモックアップを提供すると役立ちます。

あっ、そういえば。画像は長方形です:)一部の領域が完全に透明であっても、ビットマップ、または少なくともWebで使用されるものは、異なる形状を持つことはできません.

于 2012-05-24T03:21:34.150 に答える
0

これは完全なクロス ブラウザの境界半径の例です。

a{
  padding-left:5px;
  padding-right:5px;
  width:337px;
  height:292px;
}


a:hover {
  color: black;
  background:url("images/Untitled-2-2.png");
 /* Add border radius */    
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
}
于 2012-05-24T03:47:01.310 に答える