【问题标题】:Two Css Files Have Same Class - Remove class from particular Class, How?两个 Css 文件具有相同的类 - 从特定类中删除类,如何?
【发布时间】:2015-05-14 07:15:52
【问题描述】:

我在 html 页面中调用两个 css 文件具有相同的类名但不同的属性。

第一个 CSS 文件

.text {
  font-family: verdana;
  font-size: 11px;
  color: #000000;
  text-decoration: none;
  line-height: 20px;
}

第二个 CSS 文件

.text{
  margin: 0px;
  font: 13px/20px Arial,Helvetica,sans-serif;
  padding: 20px 20px 40px 35px;
}

我想通过 Jquery 或 Javascript 从 Second Css 文件中删除 .text 的功能 ....

【问题讨论】:

  • 你不能编辑选择器以使它们更具体到你想要定位的元素吗?使用 JS 作为 UI 问题的拐杖并不是一个好主意。
  • 不,我不能,也不想更改任何 css 文件
  • 我同意为此使用 JS 不是一个好主意。如果不出意外,它会使整个网站更难以维护、移植等。根据您拥有的 class="text" 元素的数量,更优雅的解决方案可能是简单地为这些元素提供内联 style 属性。
  • no i can't and also i don't want to change in any css file 可能不是最好的方法。如果您能够更改底层 CSS,正如@RoryMcCrossan 所指出的那样,您应该从源头更改它,而不是实施可能会在以后引入破坏功能的更改。也就是说,我很欣赏有时项目需求的枷锁有时是不可避免的
  • 如果您需要这样做,您可以使用脚本覆盖相同的行为。 $('.text').css({'padding':'0px'}). 这样的东西

标签: javascript jquery html css class


【解决方案1】:

正如 cmets 中所述,加载不需要的 CSS 规则以始终禁用它们并应用新规则以与另一个现有规则相同是非常糟糕的做法。如果你真的不想或不能用其他方式来做,比如修改现有的 CSS 或添加新的 CSS 规则,你可以用 jQuery 来做:

使用 jQuery:

$(document).ready(function() {

    $('.text').css({'font-family':'verdana', 'font-size':'11px', 'padding':'0', 'margin':'0'});

});

演示:https://jsfiddle.net/chimos/6g9xmxxo/

  • 所以这里给出了paddingmargin 的默认值(如果您希望.text 在某些时候使用其他值作为边距和填充,这可能会很成问题)。
  • font-familyfont-size 被定义为第一个 CSS 规则(这对于维护来说可能是非常有问题的,因为您有重复的代码并且您 - 或编辑器/维护者 - 需要记住始终保持一切正常)。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-12-03
    • 2020-10-26
    • 2022-07-27
    • 1970-01-01
    • 1970-01-01
    • 2016-07-27
    • 2017-12-20
    • 1970-01-01
    相关资源
    最近更新 更多