Погледајте у ЦСС3 Негатион (НЕ) селектор
ЦСС има неке селекторе који вам омогућују да изаберете елементе у одређеним условима као што су :лебдети, : фоцус, : ацтиве, Ипак, данас нећемо покривати те селекторе. Размотрићемо онај који је још увек мало познат, али га користи већина веб дизајнера - то је :не селектор или такође познат као негатор селектор.
Шта ради?
Сигуран сам да :не име је већ описало своју функцију, коју ће једноставно одабрати супротно од наведеног елемента или стања. На пример:
Ова синтакса ће одабрати било који други елемент осим п (параграф).
: не (п) Док ће синтакса доле у примјеру одабрати див елемент који ради не имају класу абц
див: не (.абц) Добро, хајде да пробамо овај селектор у правом примеру:
Прво, направимо пар параграфа са неколико линкова са Википедије и неколико линкова са измишљеним доменима. Овде је ХТМЛ ознака за пасус.
ЦСС: не Селецтор Демо
Јујубес апплиаке сесаме снапс цхупа цхупс чоколадни колач. Зобена торта марсхмаллов випас тоффее донут торта. Цхупа цхупс јелли цупцаке гумми медведи. Лимун капљице за колаче.
Чоколадна торта од чоколадног колача желе слатки ролни прах соуффлА¡А А © А © © торта. Випас памук слаткиша лимун капи колачић бомбон донут бонбон марципан. Мацароон цанди ликер-јелли-о. Чоколадна пита слаткиша марсхмаллов драгА? А ?? А © е памук слаткиша Бровние марсхмаллов.
Пудинг на врху марсхмаллов медвједа. Гумице од пецива од пецива фруитцаке бровние јелли гингербреад сесаме снапс. Пудинг слаткиша за пудинг. Колач од шаргарепе муффин памук бомбона тоотсие ролл колач. Јелли беанс тарт драгА ?? А? наполитанки са чоколадом. Слатко пециво од карамела шећерне шљиве слатко пециво драгА А? бонбон цанди муффин.
Пециво од марципана випас фруитцаке. Зобена торта чоколадна випас драгА ?? А? Карамеле чоколада шампањац цроиссант вафер цупцаке пие јујубес чоколадни бар. Бисцуит цанди цанес драгА ?? а €. © е.Цанди бровние овсена торта сусамова шаргарепа у праху тоотсие ролл бисквит медвјед канџа. СоуффлА ?? А ?? А'А © гумми беарс јелли беанс сесаме снапс фаворки колачић десерт слатки бонбон.
План је овде: изабрати ћемо само линкове који не упућују на Википедију и онда дати тим везама узвичник како би упозорили на те везе.
Прво ћемо додати :после псеудо-елемент на свим линковима за постављање ознаке, а ми га дефинишемо као инлине-блоцк елемент.
а: афтер дисплаи: инлине-блоцк;
Затим, да би одабрали сваки линк који не указује на Википедију, ми ћемо комбиновати :не са селектором атрибута. Селектор атрибута овде ће изабрати сваки анцхор таг са којим хреф атрибут почиње хттп://ен.википедиа.орг/ и комбиновањем са :не, очигледно ће изабрати супротно. Ево нас:
а: нот ([хреф ^ = "хттп://ен.википедиа.орг/"]): после бацкгроунд-цолор: # Ф8ЕЕБД; бордер: 1пк солид # ЕЕЦ56Д; бордер-радиус: 3пк 3пк 3пк 3пк; боја: # Б0811Е; цонтент: "!"; фонт-сизе: 10пт; маргин-лефт: 5пк; паддинг: 1пк 6пк; позиција: релативна;
Функционише! Сидрене ознаке које не упућују на Википедију сада имају ускличник.
Цхроме Буг
Ако ово видите у Цхроме-у, приметићете да ефекат приказивања није као у претходном. Чини се да сви линкови имају ускличник без обзира на УРЛ адресу.
Овај случај је заправо адресиран као грешка. Дакле, да поправимо ову грешку, морамо додати ово правило.
а [хреф ^ = "хттп://ен.википедиа.орг/"] / * Цхроме Хацк * / дисплаи: инлине-блоцк;
И сада је проблем требало да буде поправљен.
- Демо
Закључак
У неким околностима употребом :не селектор је заиста најефикаснија опција, баш као и горе наведени пример, где смо у могућности да изаберемо неке насумичне елементе без додавања непотребне класе или додатног означавања у документ..
Можете заправо додатно изградити одличне ефекте користећи овај селектор, и то је један пример: Функционалност филтера са ЦСС3
