Как сделать исключение в css

Как добавить исключение в css код?

Нужно сделать адаптацию под мобильные устройства. Сайт имеет position: relative и и ширину каждого блока приходиться прописывать вручную. Нашел способ сделать это через zoom. Все бы ничего, но перестал работать плагин pozvonim.com. Можно ли как-нибудь отдельно прописать zoom для всего сайта и для блока с плагином?

html

/*POZVONIM*/ #u5603:not(.html)

Вот, что мне пришло в голову, но все равно не работает

• Вопрос задан более года назад
• 186 просмотров

8 комментариев

Средний 8 комментариев

Как сделать исключение в css

Отрицательный CSS псевдокласс (en-US) , :not(X) — функция, принимающая простой селектор X в качестве аргумента. Он находит элементы, не соответствующие селектору. X не должен содержать других отрицательных селекторов.

Примечание:

Синтаксис

:not(selector)

Пример

p:not(.classy)  color: red; > body :not(p)  color: green; > 

CSS выше и HTML ниже.

p>Некоторый текст.p> p class="classy">Какой-то другой текст.p> span>Ещё текстspan> 

Спецификации

Specification
Selectors Level 4 # negation

Поддержка браузерами

BCD tables only load in the browser

Found a content problem with this page?

• Edit the page on GitHub.
• Report the content issue.
• View the source on GitHub.

This page was last modified on 7 авг. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

• Product help
• Report an issue

Our communities

Developers

• Web Technologies
• Learn Web Development
• MDN Plus
• Hacks Blog

• Website Privacy Notice
• Cookies
• Legal
• Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.

Псевдокласс :not

Псевдокласс :not задаёт правила стилей для элементов, которые не содержат указанный селектор.

Синтаксис

В качестве селектора могут указываться псевдоклассы, теги, идентификаторы, классы и селекторы атрибутов. Нельзя использовать псевдокласс :not (конструкция :not(:not(. )) запрещена) и псевдоэлементы.

Значения

HTML5 CSS3 IE Cr Op Sa Fx

     input:not([type="submit"])  
Ваше имя: 
Прилагаемый файл: 

В данном примере стиль применяется ко всем тегам за исключением тега, в параметрах которого установлено type=»submit» (кнопка «Отправить»). Результат примера показан на рис. 1.

Рис. 1. Результат использования псевдокласса :not

CSS по теме

CSS псевдокласс отрицания :not(селектор)

Селектор :not() или псевдокласс отрицания, позволяет выбрать элементы, или селекторы отличные от указанных.

Что нельзя использовать с псевдоклассом :not():

• Использовать в одном селекторе несколько псевдоклассов :not().
• Использовать с псевдоэлементами (::first-letter, ::first-line и так далее).
• Нельзя использовать с селекторами потомков (например, div ul a).
• Использовать в групповых селекторах (комбинации из селекторов).

Поддержка браузерами

Селектор	Chrome	Firefox	Opera	Safari	IExplorer	Edge
:not(селектор)	4.0	3.5	9.6	3.2	9.0	12.0

CSS синтаксис:

:not(селектор)  блок объявлений; > 

Версия CSS

Пример использования

Давайте рассмотрим пример в котором по разному стилизуем изображения. Допустим у нас есть изображения фиксированного размера со следующими значениями:

img  /* выбираем все изображения */ width: 100px; /* ширина элемента в пикселях */ height: 100px; /* высота элемента в пикселях */ > 

Создадим селектор класса .photo и применим его к необходимым изображениям, чтобы они получили оранжевую границу.

.photo  /* выбираем все элементы с классом photo */ border: 2px solid orange; /* сплошная граница размером 2 пикселя оранжевого цвета */ > 

Перед Вами стоит задача изменить стиль для всех изображений (предположим, что их сотни), но при этом у Вас ограниченное количество времени и необходимо сделать так, чтобы эти изменения затронули изображения с классом .photo. Для этого Вам необходимо создать селектор совместно с псевдоклассом отрицания:

img:not(.photo)  /* выбираем все изображения, которые не имеют класса photo */ border: 2px dashed green; /* пунктирная граница размером 2 пикселя зеленого цвета */ > 

Всё вместе и результат:

   charset = "UTF-8"> Псевдокласс отрицания :not() img  /* выбираем все изображения */ width: 100px; /* ширина элемента в пикселях */ height: 100px; /* высота элемента в пикселях */ > .photo  /* выбираем все элементы с классом photo */ border: 2px solid orange; /* сплошная граница размером 2 пикселя оранжевого цвета */ > img:not(.photo)  /* выбираем все изображения, которые не имеют класса photo */ border: 2px dashed green; /* пунктирная граница размером 2 пикселя зеленого цвета */ >  src = "nich.jpg" alt = "nich" class = "photo"> src = "nich.jpg" alt = "nich" class = "photo"> 
src = "nich.jpg" alt = "nich"> src = "nich.jpg" alt = "nich"> src = "nich.jpg" alt = "nich">  

Как вы можете заметить на изображении ниже, мы справились с поставленной задачей и стилизовали с использованием псевдокласса отрицания :not() все изображения, отлично от изображений с классом photo:

CSS селекторы

© 2016-2023 Денис Большаков, замечания и предложения по работе сайта Вы можете направить по адресу basicweb.ru@gmail.com

Кажется, вы используете блокировщик рекламы 🙁

Этот ресурс не является коммерческим проектом и развивается на энтузиазме автора сайта, который посвящает все свое свободное время этому проекту.

Добавьте, пожалуйста, basicweb.ru в исключения блокировщика рекламы, этим вы поможете развитию проекта.