Объявление двойного класса в CSS

Question

Итак, из-за двух наборов грязных процедурных кодов, сталкивающихся с ужасным ужасом Lovecraftian, о котором я не могу многого говорить, мне приходится иметь дело с ситуацией, когда у меня будет два отдельно Объявления классов CSS на одних и тех же объектах. Например, я мог бы иметь конечный результат, который выглядит как ...

<div class="my_class" class="cuthullus_child_class_that_overwrites_EVERYTHING"> 
...something goes here, or so I have been told... 
</div> 

Я знаю, имеющих несколько объявлений, как это плохо, но не так, что я могу реально сделать об этом в настоящее время. Тем не менее, я может контролировать содержимое одного из этих классов и, возможно, порядок, в котором они отображаются ...

Учитывая, какие эффекты будет иметь порядок на классах, показывающих/не отображающих? Переписывает ли другой? Будет ли ошибка, и я фактически оставлен без класса? Будут ли они сочетаться, как если бы оба были в одной декларации? Или с ним просто уничтожить Данвича и все, что я ценю?

Edit: Глядя в него глубже, это выглядит как DIV будет полностью отказаться от показа, но я "м пытается найти путь вокруг, что, если это возможно

Answer 1

Два атрибута класса на одном и том же элементе будут разбиты. Второй класс будет проигнорирован, см. Ниже.

Единственная альтернатива - добавить встроенный стиль, если вы не можете очистить код в первом экземпляре.

.my_class { 
 
    color: blue; 
 
} 
 
.alt_class { 
 
    color: red; 
 
}

<div class="my_class" class="alt_class"> 
 
    ...something goes here, or so I have been told... 
 
</div>

Answer 2

Почему бы вам не использовать так же, как это.:

<div class="my_class second_class third_class"> 
...something goes here, or so I have been told... 
</div> 

Разве это не работает для вас ?! или вы пытаетесь достичь чего-то еще ?!

Answer 3

Почему вы не просто использовать

<style> 
.parent_class{ 
margin:10px; 
} 

.parent_class.child_class{ 
margin:20px; 
background:red; 
} 
</style> 

<div class="parent_class child_class"> 
...something goes here, or so I have been told... 
</div> 

Answer 4

Использование двойного класса атрибутов для одного элемента в HTML недействительно.

Это справедливо, когда вам нужно использовать несколько классов:

<div class="firstClass secondClass"></div> 

Порядок не имеет значения, классы будут ориентированы одинаково от HTML, но зависит от того, CSS. Например:

.secondClass{background: salmon} 
.firstClass{background: skyblue} 

firstClass переопределять secondClass, потому что он установлен после secondClass

Answer 5

в первую очередь, вы должны поместить все классы в одном «класс» атрибут, разделенных одним пробелом, в противном случае браузер будет принимать только первый, он же:

<div class="my_class cuthullus_child_class_that_overwrites_EVERYTHING"> 
...something goes here, or so I have been told... 
</div> 

Чтобы ответить на ваш второй вопрос, в зависимости от того один приходит позже в таблице стилей, перезаписывает правило, также существует ш с первого класса, aka:

.my_class{ 
color: red; 
} 
.cuthullus_child_class_that_overwrites_EVERYTHING{ 
color: blue; 
} 

Цвет будет синим. Если бы они были заказаны наоборот, цвет был бы красным. Если какое-либо из правил содержит «! Important», это будет иметь приоритет.

Кроме того, если существуют различные правила в пределах классов, они не будут противоречить друг другу, и все будет применяться, иначе:

.my_class{ 
color: red; 
} 
.cuthullus_child_class_that_overwrites_EVERYTHING{ 
font-size: 36px; 
} 

цвет будет красным, а размер шрифта будет 36px.

На самом деле, распространено и не проблематично объявлять более одного класса для одного объекта; поскольку jQuery часто используется для добавления/удаления классов на основе разных событий.