【问题标题】:How to ignore CSS img styling for certain sections of the website?如何忽略网站某些部分的 CSS img 样式?
【发布时间】:2014-10-28 17:43:44
【问题描述】:

我需要一些帮助,最好使用 jquery sn-p。我们正在寻找的 sn-p 将允许我们忽略同一页面中的某些 css 类。

EX) 我们有 Header 标志 img,我们想忽略 img 的 css 样式,如何实现?

CSS

img {
  position: absolute;
  top: 50%;
  left: 35%;
  width: 320px;
  height: 240px;
  transform: translateZ(.25px) scale(.75) translateX(-94%) translateY(-100%) rotate(2deg);
  padding: 10px;
  border-radius: 5px;
  background: rgba(240,230,220, .7);
  box-shadow: 0 0 8px rgba(0, 0, 0, .7);
}

我们想忽略第一个 img 的 css 样式,而保留第二个 img 的样式,这是最好的方法吗?

【问题讨论】:

  • 使用类 - <img /> <img class="style"> | .style { /*style*/ }...
  • 使用 CSS 选择器,例如:.nav > img , .header > .left > img 等。它将设置应用 CSS 的范围。

标签: jquery css jquery-selectors


【解决方案1】:

你可以这样做:-

img:not(:first-child){
  position: absolute;
  top: 50%;
  left: 35%;
  width: 320px;
  height: 240px;
  transform: translateZ(.25px) scale(.75) translateX(-94%) translateY(-100%) rotate(2deg);
  padding: 10px;
  border-radius: 5px;
  background: rgba(240,230,220, .7);
  box-shadow: 0 0 8px rgba(0, 0, 0, .7);
}

Demo

【讨论】:

  • 您可能希望如上所述向标题徽标图像添加一个 id 和类,而不是使用 :first-child ,因为出于某种原因他希望 jquery sn-p 执行此操作,所以我假设出于某种原因,他想在徽标上添加/删除 css。所以你可以使用类似 $('#header_logo').addClass('.header_logo);然后将上面的 css 更改为 img:not(.header_logo){
  • @naw103 他没有提供 html。我刚刚给了他一个想法,他可以如何将 css 应用于图像 exept 第一个图像,不管它有没有 id。
  • 他可以根据自己的要求使用选择器
【解决方案2】:

为您的标题徽标图像提供一个 id 或类,并使用 css 的 :not 选择器。喜欢

:not(selector) {
    css declarations;
}

【讨论】:

    【解决方案3】:

    您的 CSS 声明 <img> 的所有实例都将应用该样式。

    您可以使用类选择器而不是通用选择器来设置样式,以避免包含第一张图片。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-06-27
      • 1970-01-01
      • 2010-10-31
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多