Филтри у селекторима са Јкуери и ЦСС3 ИИ

Преглед садржаја
Овим елементима или селекторима се може манипулисати помоћу Јкуери -ја и цсс -а ради стварања ефеката и добијања садржаја, сакривања или додавања и примене одређеног ефекта на њега, олакшавајући рад програмерима. Неки селектори су познатији по цсс коду, на пример:
ИДЕНТИФИКАТОРИ
Они су елемент највише хијерархије и дефинишу опште параметре за елементе блока Дефинишу се као #ид и обично се примењују на листе или блокове.

Ово је бирач идентификатора пасуса

Параграф без селектора


Можемо видети како идентификатор утиче на параграф унутар блока, али не и на онај споља.
ЛЕКЦИЈЕ
Они су елементи ниже хијерархије и користе се за појединачне елементе или за дефинисање класа унутар идентификације, као што су:

Ово је бирач идентификатора пасуса

Плави пасус са стр

Плави пасус са дивЦрвени одломак са див

Овде можемо видети да класа .паррафоројо дефинише боју пасуса, али зависи од величине која дефинише идентификатор више хијерархије #парарафо.
Док независна класа .паррафоазул може применити елемент п који не зависи од никога, можемо га чак применити и на друге елементе као што је див, али ако покушамо да применимо класу паррафоројо независно од идентификатора #параграф, видећемо да то чини не ради јер не испуњава хијерархију која намеће његов идентификатор #параграф.
Постоји много селектора које можемо користити овде, видећемо неке
Парни (парни) и непарни (непарни) селектор
Овај селектор се примењује на низ елемената који користе исту класу и може утицати на парне или непарне елементе, на пример бојимо позадину листе пасуса.

ПАРАГРАПХС

Корисник 1 је оставио поруку

Корисник 2 је оставио поруку

Корисник 3 је оставио поруку

Корисник 4 је оставио поруку

УЛ ЛИСТ

  • Корисник 1 је оставио поруку
  • Корисник 2 је оставио поруку
  • Корисник 3 је оставио поруку
  • Корисник 4 је оставио поруку

ИЗБОРНИК ПРВИ (први) И ПОСЛЕДЊИ (последњи)
Ови селектори нам омогућавају да манипулишемо првим и последњим елементом одређене листе, на пример листу постављамо сивом бојом, први елемент зеленом и последњи елемент плавом бојом.

УЛ ЛИСТ

  • Корисник 1 је оставио поруку
  • Корисник 2 је оставио поруку
  • Корисник 3 је оставио поруку
  • Корисник 4 је оставио поруку

ФОКУСНИ СЕЛЕКТОР
Фокус на елемент се активира када кликнете на елемент и деактивира се када кликнете на другу област веба или на други елемент. Видећемо пример са обрасцем за пријављивање, креирамо класу .фоцологин, а затим га примењујемо на идентификатор обрасца #логин како бисмо утицали на све елементе које садржи. Такође га можемо применити на слој или див блок и поставити образац унутар блока.

ФОРМ

Корисничка лозинка:

Доделите или промените цсс стил елементу помоћу АддЦласс -а
Ако желимо да динамички додељујемо цсс стил или да га мењамо према неком утврђеном стању, користићемо АддЦласс. У овом случају имамо .греен дугме класе и тексту уноса типа додељујемо .бок бок класе из Јкуери -ја. То не утиче на унос врсте лозинке, нити на дугме за слање јер им нисмо доделили ниједну класу цсс.

ОБРАЗАЦ ЗА РЕГИСТРАЦИЈУ

Име:
Адреса:
Телефон:
Е-маил:

СЕЛЕЦТОР ЕКУАЛ ОР ЕКУАЛ
Овај селектор омогућава идентификацију елемента низа елемената према положају у којем се налази ћелија табеле, на пример. Морамо имати на уму да су елементи наведени као индекси матрице која почиње са 0,1,2 итд. .

 
Наслов А. Наслов Б. Наслов Ц.
Ћелија 0 Ћелија 1 Ћелија 2
Ћелија 3 Ћелија 4 Ћелија 5

Настављајући са табелама и применом селектора, видећемо како да на позадини наизменично направимо дизајн позадине у бојама редова табеле, слично ономе што је раније примењено са пасусима и листама. Не додајемо толико цсс -а или дизајна да би се ефекат у основи боље ценио.

 

КАЛЕНДАР ПРЕДМЕТА

Распоред ПОНЕДЕЉАК УТОРАК СРЕДА ЧЕТВРТАК ПЕТАК
10:00 - 12:00 Веб развој / ЦСС Веб развој / ЈКУЕРИ Веб / ПХП програмирање Веб развој / ЈКУЕРИ Програмирање / ЈАВА
21:00 - 22:00 Базе података / МИСКЛ Веб развој / ЈКУЕРИ Програмирање / ЈАВА Веб / ПХП програмирање
22:00 - 23:00 Веб / ПХП програмирање Веб развој / ЦСС Програмирање / ЈАВА

СЕЛЕЦТОР нтх-цхилд
Настављајући са претходним примером, можемо користити селектор н -тог детета као допуну, слично селектору ек, али разлика је у томе што се са н-тим дететом позиције могу означити у облику аритметичке операције. Користи се за одабир једног или више елемената, али под условом да је то н -то дете свог родитеља. Овај бирач је користан за одабир другог пасуса блока или треће ставке листе итд. Елементи се не узимају као низ, већ по реду први, други итд.
На пример, ако у претходној скрипти додамо
У овом случају ће бити изабране непарне колоне

Други примери практичне употребе овог селектора били би
  • Непарне колоне н-дете (2н + 1)
  • Упарене колоне нтх-цхилд (2н)
  • Прва и четврта колона нтх-цхилд (3н + 1)
Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен
wave wave wave wave wave