html - 我的 css a 类正在影响我的菜单栏元素，但我只希望它在我的照片库中工作

Question

<div class="gallery">
        <a tabindex="1"><img src="images/smile.jpg"></a>
        <a tabindex="1"><img src="images/smile.jpg"></a>
        <a tabindex="1"><img src="images/smile.jpg"></a>
        <a tabindex="1"><img src="images/smile.jpg"></a>
</div>

a{
  float:left;
  width:25%;
  height:25%;
  position:relative;
  border:1px solid #333;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
}

a img{
  display:block;
  width:100%;
  height:100%;
  -webkit-transition-property:width, height;
  -webkit-transition-duration:300ms;
  -moz-transition-property:width, height;
  -moz-transition-duration:300ms;
  -o-transition-property:width, height;
  -o-transition-duration:300ms;
  position:absolute;
  z-index:1;
  opacity:0.3;
  cursor:pointer;
}

这是一个真正的初学者问题，但我不再擅长 CSS。

我只想使用上面的 css 来处理我的画廊类，但现在它会影响页面上的所有 href。

如有任何帮助，我们将不胜感激。谢谢。

Answer 1

改变:

a{
...
}

a img{
...
}

收件人:

.gallery a{
...
}

.gallery a img{
...
}