CSS атрибут селекторлорунун түрлөрү - Semalt Expert

HTML элемент класстан, IDден жана атрибуттардан турат. Атрибут селектору атрибутун же атрибут мааниси бар HTML элементтерин тандап алат. Attribute селекторлору белгилүү бир атрибут же белгинин мааниси бар HTML элементтерине стилдерди колдонуунун жөнөкөй ыкмасын камсыз кылат. Аттрибут селекторлору эки квадрат кашаа менен аныкталат, алар атрибутту анын мааниси менен камтыйт. Ошентсе да, сиз элементтин түрүн селекторду койсоңуз болот. CSS [атрибут] селектору стилдин эрежелерин элементтерге, эгерде ал берилген белгилерден турган болсо, колдонулат.

Атрибут селекторлорунун түрлөрү

Атрибут селекторлорунун ар кандай түрлөрү бар, алардын ар бири өзүнчө учурларда колдонулат:

CSS [атрибут | = "мааниси"] Селектор белгилүү бир белгиге ээ элементтерди белгилейт жана ал аныкталган мааниден башталат.

CSS [атрибут ~ = "мааниси"] Селектор белгилүү бир сөзү бар касиети бар элементтерди табуу үчүн колдонулат.

CSS [атрибут ^ = "мааниси"] Селектор белгилүү бир маанидеги касиети бар элементтерди табат. Мааниси сөзсүз эле бүтүндөй сөз эмес.

CSS [атрибут $ = "мааниси"] Селектор аныкталган мааниси менен аяктаган атрибут мааниси бар компоненттерди табат.

CSS атрибутун тандап алуучулардын тиркемелери

Универсалдуу, класс же ID селекторун колдонуунун ордуна, атрибут селекторун колдонуунун ар кандай жолдору бар

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

Стилдөө формалары

Атрибут селекторлору класстар же ID жок формага стилдерди жасоодо абдан пайдалуу.

Стиль шилтемелери

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

Чек арасы

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

Стилдөө түстөрү

CSS атрибутун тандап алуучулар өзгөчө түс маанисине ээ болгон бардык элементтерди стилдештирүүнү оңой кылат. Сиз түстүү ачкыч сөзүн, RGB (), RGBA (), HSL () жана HSLA () белгилерин колдоно аласыз. RGBA түс маанилери - түстүн тунуктугун аныктоочу канал менен RGB түстүү моделинин кеңейтүүсү. Параметрлердин мааниси1.0 (тунук эмес) ден 0.0 чейин (тунук)

HSL түстүү модели (Hue_saturation_Lightness) деп түшүндүрүлөт. Реңк сүрөтү бурч (0-360) же түстүү дөңгөлөк түрүндө болот. Каныккандык жана жарыктык пайыздык деңгээлде өлчөнөт, 0% каныккан көлөкө же боз, ал эми 100 толук түстү билдирет. 100% жеңилдик акты билдирет, 0% - кара.