Как переопределить правила в css?
Подскажите пожалуйста как можно переопределить правило в css? Я задал стиль всем псевдоэлементам заголоаков, top: 50%, для боковой линии, чтоб она стояла сбоку по центру заголовка, теперь в одной секции мне нужно было переопределить такой же заголовок, сделать его bottom: 0; но стили не переопределяются, !important не помогает. Вот код:
h2::before < content: ""; background: #222; height: 2px; width: 120px; position: absolute; top: 50%; margin-left: -150px; >h2::after Fully Supported template
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada sodales risus, a adipiscing lorem commodo vitae. Ut semper semper lacus. Suspendisse convallis vel tellus at consectetur. Aenean risus arcu
Read more
Заголовок, который нужно переопределить
.template h2::after
Отслеживать
задан 20 окт 2018 в 14:32
89 1 1 золотой знак 6 6 серебряных знаков 15 15 бронзовых знаков
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
Вам нужно переопределить свойства margin-left и position
h2::before < content: ""; background: #222; height: 2px; width: 120px; position: absolute; top: 50%; margin-left: -150px; >h2::after < content: ""; background: #222; height: 2px; width: 120px; margin-left: 30px; position: absolute; top: 50%; >.template h2::after
Fully Supported template
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada sodales risus, a adipiscing lorem commodo vitae. Ut semper semper lacus. Suspendisse convallis vel tellus at consectetur. Aenean risus arcu
Read more Как переопределить встроенные стили CSS
Эта статья была написана в 2009 году и остается одной из наших самых популярных публикаций. Если вы хотите узнать больше о CSS, вы можете найти эту недавнюю статью о технологиях CSS для дисплеев сетчатки большой интерес.
Одной из самых мощных функций CSS является каскадирование. Знание того, как браузер выбирает и применяет ваши стили, является бесценным знанием. Новички могут найти это особенно запутанным, учитывая, что на использование стиля влияет метод, используемый для включения CSS, порядок правил, способ выбора селекторов и специальные объявления, такие как !important
Встроенные стили – это те, которые определены в самом HTML, например
This is an inline style that should be blue .
Встроенные стили имеют наивысший приоритет среди всех CSS. В целом, я бы порекомендовал вам избегать их использования и размещать ваши объявления CSS во внешних файлах. Тем не менее, вы можете не иметь такой роскоши, если вы работаете в устаревшей системе или не имеете прямого доступа к HTML-коду.
К счастью, есть способ переопределить встроенные стили из внешней таблицы стилей:
strong[style]
Это заставит текст в strong Этот метод работает во всех основных браузерах, включая:
- Internet Explorer 8.0
- Mozilla Firefox 2 и 3
- Опера 9
- Apple Safari и
- Гугл Хром
Internet Explorer 6 и 7 являются заметными исключениями. Тем не менее, эта техника не то, что вы должны использовать в повседневной жизни. Держите свой CSS чистым и переопределяйте встроенные стили только тогда, когда нет абсолютно никакой альтернативы.
И если вам понравилось читать этот пост, вы полюбите Learnable ; место, чтобы узнать новые навыки и приемы у мастеров. Участники получают мгновенный доступ ко всем электронным книгам SitePoint и интерактивным онлайн-курсам, таким как Практический CSS .
Комментарии к этой статье закрыты. У вас есть вопрос о CSS? Почему бы не спросить об этом на наших форумах ?
Как переопределить стили?
и никаких изменений, в браузере если открыть код, всё меняется, но в файле нет, кто что может подсказать?
- Вопрос задан более трёх лет назад
- 191 просмотр
Комментировать
Решения вопроса 0
Ответы на вопрос 1
Не понятно к чему первый кусок кода. В нём вы подключаете скрипт.
Стиль прямо на странице нужно писать так, как в вашем последнем примере.
Делать это нужно после того, как вы указали ссылку на стиль, например так:
// Тут какой то html // Потом файл стилей // Потом ваш переопределённый стиль .searchFormContainer
Как работает переопределение стилей CSS?
В этой статье мы узнаем, как работает переопределение стилей CSS. Каскадные таблицы стилей , называемые CSS, представляют собой просто разработанный язык, предназначенный для упрощения процесса создания презентабельных веб-страниц. CSS позволяет применять стили к веб-страницам. Что еще более важно, CSS позволяет вам делать это независимо от HTML, из которого состоит каждая веб-страница.
Переопределение: Переопределение в CSS означает, что вы предоставляете любое свойство стиля элементу, для которого вы уже предоставили стиль. Например, если вы предоставили какой-то стиль элементу с помощью внешнего CSS, и после этого вам нужно изменить CSS, но если вы не нашли, где вы написали код, вы можете просто переопределить стиль, используя in -line CSS с наивысшим приоритетом.
Порядок приоритета
inline stylesheet (highest) >>
tags >> external style sheet(lowest)
Встроенная таблица стилей: Если вы используете любую встроенную таблицу стилей, она имеет наивысший приоритет и, следовательно, переопределяет любое свойство, определенное в тегах
, или свойство, определенное во внешнем файле таблицы стилей.
Тег стиля: если вы используете какое-либо свойство, определенное в теге
, оно переопределит свойство, определенное в любом внешнем файле таблицы стилей.
Внешний CSS: Если вы используете какое-либо свойство, определенное во внешнем файле таблицы стилей, оно имеет самый низкий приоритет, и свойство, определенное в этом файле, будет применяться только тогда, когда два вышеуказанных свойства неприменимы.
Пример 1: В приведенном ниже примере мы переопределили свойство. Во-первых, мы определили цвет header1 как красный с помощью тега стиля, а затем переопределили цвет header1 на зеленый с помощью встроенной таблицы стилей.