Как изменить поведение приоритета CSS для прекращения переопределения классов css?

Question

<input type="checkbox" value="true" name="role" id="role1" class="margin-class" checked="checked"> 

input[type="checkbox"] { 
    height: 1.42857em; 
    margin-bottom: 1.42857em; 
    position: relative; 
    top: 6px; 
} 

.margin-class { 
    margin-bottom: 0; 
} 

Оба эти css происходят из bundle.css, где мне не разрешено вносить какие-либо изменения. Но я хочу применить маржинальный класс обязательно. Здесь selector css переопределяет класс css. Я знаю правило , где приоритет имеет селектор css. Но так или иначе, я могу переопределить правило . Мне также не разрешено использовать локальный css и не разрешено делать какие-либо изменения, как! Важно и все.

Answer 1

Если вы не можете изменить комплектный CSS или поставить свой собственный стиль, ваш единственный выход использует атрибут встроенного стиля:

<input type="checkbox" value="true" name="role" id="role1" style="margin-bottom: 0" checked="checked"> 

Или применение стиля с помощью JavaScript, если вы не можете модифицировать HTML тоже.

Если вы не можете сделать любые из этих вещей, то вы в значительной степени застряли. Если это правило предназначено для применения к определенным элементам класса, то связанный CSS плохо написан. Вы не можете изменить, как работает каскад, кроме как с помощью предоставленных вам функций (и даже тогда он не меняет способ его работы).

Answer 2

Вы можете быть более конкретным, как предоставление идентификатора селектору и предоставление ему стилей!

Answer 3

Попробуйте jsfiddle. Нажмите кнопку. Я использовал сценарий java для внесения изменений.

document.getElementById('role1').style.top ='50px' 

Вы можете поместить все такие изменения в функции, а затем вызвать функцию в окне Load (Там нет необходимости для кнопки, только для иллюстрации). Надеюсь это поможет.