0

div にカーソルを合わせると、その div のアウトラインの色が変わります。予想どおり、div が互いに重なり合うため、境界線が重なり合い、余分なピクセルが厚くなります。これを避けるために上部に 1px の余白を追加しますが、これによりホバリング効果が台無しになります。

これは、私がやっていることの基本的な例と、ホバー http://jsbin.com/UcOTelUH/1/edit?html,css,outputの問題です

すべての側面をホバリングすると、重なり合っているため、底面を除いて色が変わります。兄弟セレクターまたはその他のトリックを使用してこれを回避する方法はありますか?

4

1 に答える 1

3

使用できます (ここを参照):

div{
  width: 100px;
  height: 30px;
  border: 1px solid #000;
  margin-bottom:-1px;
  position:relative;
  z-index:0;
}

div:hover{
  border-color:red;
  z-index:1;
}

または、 のoutline代わりにプロパティを使用する場合は、次をborder使用します。

div{
  width: 100px;
  height: 30px;
  outline: 1px solid #000;
  margin-top: 1px;
  position:relative;
  z-index:0;
}

div:hover{
  outline-color:red;
  z-index:1;
}
于 2013-11-14T15:44:50.297 に答える