Переопределить элемент. Стиль с помощью CSS

У меня есть HTML-страница из компоновщика страниц, и она вставляет атрибут style непосредственно элементу. Я считаю, что это считается element.style.

Я хочу переопределить его с помощью CSS. Я могу сопоставить элемент, но он не отменяет его.

Как я могу переопределить стиль с помощью CSS?

Ответ 1

Хотя он часто нахмурился, вы можете технически использовать:

display: inline !important;

Как правило, это не хорошая практика, но в некоторых случаях может потребоваться. Что вам нужно сделать, это отредактировать код, чтобы вы не применяли стиль к элементам <li>.

Ответ 2

Этот CSS перезапишет даже JavaScript:

#demofour li[style] {
    display: inline !important;
}

или только для первого

#demofour li[style]:first-child {
    display: inline !important;
}

Ответ 3

element.style происходит от разметки.

<li style="display: none;">

Просто удалите атрибут style из HTML.

Ответ 4

Использование! important переопределит element.style через CSS, как Изменение

color: #7D7D7D;

color: #7D7D7D !important;

Это должно сделать это.

Ответ 5

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

С помощью инструментов разработчика вашего браузера укажите точное значение атрибута стиля оскорбления; например:.

"font-family: arial, helvetica, sans-serif;"

или

"display: block;"

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

p span

или

section.article-into.clearfix p span

Наконец, в вашем custom.css используйте селектор [attribute ^ = value] и важное объявление:

p span[style^="font-family: arial"] {
  font-family: "Times New Roman", Times, serif !important;
}

Обратите внимание, что вам не нужно указывать значение атрибута всего стиля, достаточно, чтобы однозначно совместить строку.

Ответ 6

В соответствии с моими знаниями Inline sytle на первом месте, поэтому класс css не должен работать.

Использовать JQuery как

$(document).ready(function(){

   $("#demoFour li").css("display","inline");
  });

You can also try 

#demoFour li { display:inline !important;}

Ответ 7

Использовать JavaScript.

Например:

var elements = document.getElementById("demoFour").getElementsByTagName("li");
for (var i = 0; i < elements.length; i++) {
    elements[i].style.display = "inline";
}