CSS, жасалма, жасалма: үстүнө, бала, максаттуу

HTML жана CSS бириктирип, сен интернет баракчалардын ичиндеги баарын элементтерин көзөмөлдөй аласыз. стилдер менен ар кандай блок же сызыктын көрүнүшүн өзгөртө аласыз. Көп учурда бир кыйла татаал тапшырманы аткаруу үчүн керек Coder - өзүнчө бир бөлүгүн, же бир мамлекет катары, өзү эмес, элементтин көрүнүшүн өзгөртүү үчүн. Бул учурда, жасалма CSS жардам.

белгилери кадимки класстарда эле негизинде Pseudo-иш, бирок денелик, алар бул жерде жок болчу. Алар кадимки селектор тандап эмес, турган документ маалымат киргизилбеген элементтерге негизинде тандалып алынышы мүмкүн. Бул жөнөкөй мисал: Эгер кызыл баскычын бар, сиз аны көк болуп калкып кийин келет. Теориялык жактан алганда, бул JavaScript боюнча жүзөгө ашырылышы мүмкүн, бирок ал эмне үчүн кыйынга турат? колдонсок көп ыңгайлуу : CSS чаап барат. Анын жардамы менен сиз каалаган бөлүмүндө чычкан курсорун гана себеп болот параметрлерин бере алат.

CSS жасалма-класстардын тизмеси дайыма болот. Балким, сиз бул материал, бир нече жаңы пайда окуп жатканда. Алгач, CSS3 тактоо пайда адамдарды карап көрөлү.

: N-ынчы-жылдын түрү

Сен башкача айтканда тагышты түстөрдү колдонуу көрүнө турган тизмесин бар дейли, алгачкы кызыл тамгалар менен жазылган, мисалы үчүн, ал эми экинчиси - .. Blue, кайра үчүнчү кызыл, төртүнчү көк дагы. Буга чейин, сиз жаңы класстарды түзүү керек эле. өткөн жайылмасын класс тизме боюнча ар бир элементтин кошулуп, андан кийин салынган, алардын көрүнүшүн өзгөрткөн. Бул өтө жакшы жана калыбын булгоочу эмес.

Азыр баары кыйын болуп саналат. Колдонуу CSS жасалма-класс: чи-жылдын түрү. Бул белгилөө менен эч нерсе өзгөргөн жок, каалаган көрүү натыйжа алууга мүмкүндүк берет. принцип жөнөкөй: эгер сиз бир селектор киргизип, жана атынан кийин кашаанын ичинде керектүү элементтерди таба турган бир чечим же ачкыч жаз. Мисалы чи-жылдын түрү ,: (да) эркин бардык элементтери, ошондой эле: чи-жылдын түрүнө (так) - так. акысы көп саны так контролдоо үчүн пайдаланылган жок. кашааларга, мүмкүн номери - Бул окуя стилде кимдин индекси элементине карата ушул санына барабар болот.

: N-ынчы-бала

иш-аракеттердин негизинде бул CSS жасалма-класс өткөн адамга окшош болот, бирок андан айырмаланып, ал тандалып пунктунун балдар менен гана иштейт. <Ул> ата-<ли>, анткени,-чи бала: Мисалы, сен <ли> тизмесине тэг пайда өзгөчөлөштүрүү үчүн колдонуп келсе, ул жай үлгүсүн пайдалануу керек.

бисмиллах так контролдоо үчүн пайдаланылышы мүмкүн. Алар Баштоочу үчүн абдан оор, бирок, аны баары кыйын болуп калат кантип синтаксистин бир аз кымбат да көптү камтыйт. бисмиллах болуп төмөнкүлөр саналат: бир +, б, а - бир себеби болуп саналат, б - жабылат. Мисалы, кашаанын ичинде н турат, ар бир балага элементтер жасалма тандайт (бул түрүндө жана кошумча шарттары көрсөтүлгөн эмес, себеби, б). Сиз N + 2, алгачкы башка бардык элементтер (ордун эки барабар, себеби) көрсөтүлүүгө анда тандалып алынат. Баарынан маанилүүсү, бул жолу иш жүзүндө изилдөө. Бала компоненттерин жана ар кандай акысы менен тажрыйба.

: Акыркы бала

Баары жөнөкөй. CSS балдарды жасалма-класстар бир нерсени тандоо үчүн колдонулат. Бул ата-компонентинин акыркы баланы тандайт. кийинки сапта анын которууну качуу акыркы блок абдан көп, мисалы, столдо акыркы сапты тандап же Сизде алып салуу үчүн колдонулат.

: N-ынчы-акыркы-бала

иш негизинен менен буга чейин айтылган чи балага окшош, ал эми карама-каршы багытта иш-аракет, башкача айтканда. өйдө түрткү берет элементтерди колдонууда E.. Акыркы бир нече ден табуу үчүн керек болсо, бул ыкма өтө пайдалуу.

Сиз баары кадимки класстары боюнча жакшы иш болот, анткени бул жасалма-класстар жана жасалма элементтер, пайдасыз CSS деп ойлошу мүмкүн. Бул андай эмес. :-Чи бала ,: nth- акыркы-бала жана алардын аналогдору ири долбоорлор менен иштеген абдан ыңгайлуу болот - мисалы, блок балдардын өтө көп санда бар учурларда. Кол класстар узак жана оор уюштуруу.

Pseudo-мамлекеттик контролдоо

Эгер кайсы бир мамлекеттик элементтин көрүнүшүн өзгөртүү керек болсо, эмне? Бул окуя CSS жасалма басып, көрсөтүп жана башка актылар менен камсыз кылууда. Келгиле, майда-чүйдөсүнө чейин, аларды карап көрөлү.

: ссылка

Бул жасалма CSS шилтемелер, баары эмес, бирок бир гана ушул, бирок келген эмес. турган элементтер , анткени образын көрсөтүүгө болот, ал колдонуучу боло элек.

гана буга чейин шилтемелер барып көзөмөлдөйт мурунку элестетет, аналогу. Бул эки жасалма-класстардын айкалыштыруу, сен керек болсо, так тэг көрүнүшүн аласыз. мамлекеттер дарылоо тарых кийин белгилүү браузерлер үчүн эсептелген жана бошотулат деп, Бирок, баса белгилей кетчү.

Жогоруда сүрөттөлгөн жасалма шилтемелер жумуш үчүн керектүү көбү. Бирок, бардык элементтер керек. Бир нече жактан толугу менен беттин кандайдыр бир бөлүгүнө карата да колдонууга болот.