html - 使用 CSS 代码影响除一张图像以外的所有图像

Question

我想影响我网站上除了一张(也许两张)图片以外的所有图片。我，有点难以理解。

请问有没有我添加的某种代码不影响某些图像？

这是我目前使用的代码:

// IMAGE 5 STYLING
#collection-56aa7c3422482efd63ae16e1, #collection-

56aa841e5dc6de4554608778, #collection-55b98395e4b08fff340c1e65,
#collection-5807e5edf7e0abd4e55c38bb{
.sqs-block-image .image-block-wrapper {
height: 150px !important;
width: 150px !important;
margin: 0 auto !important;
padding-bottom: 0px !important;
margin-bottom: 0px !important;
border-radius: 300px !important;
transition: all ease-in-out 600ms !important;
    img {
      height: 150px !important;
      width: 150px !important;
      padding: 0 !important;
      left: 0 !important;
      top: 0 !important;
      border-radius: 300px !important;
    }
}
.image-caption {
text-align: center;
margin-left: 0px !important;
}
.image-caption p strong {
text-transform: uppercase;
color: #555 !important;
color: #555 !important;
border-bottom: solid 1px #ccc;
padding-bottom: 10px;
transition: all ease-in-out 600ms !important;
}
  .sqs-block-image:hover {
  .image-block-wrapper {
 -webkit-transform:rotate(10deg) !important;
    -moz-transform:rotate(10deg);
    -o-transform:rotate(10deg);}
.image-caption strong {
  letter-spacing: 2px;
}
  }}
// END OF IMAGE 5 STYLING

谢谢你的帮助:)

苏菲。

Answer 1

一种快速的方法是使用 css 选择器 img:not(.not-affected-img) 并将 .not-affected-img 类添加到不应受影响的图像。

尽管您实际上应该为不断变化的图像添加一个类:

.image-effect:hover {
  transform: rotate(10deg);
}