Selettur tas-CSS u r-rwol tiegħu fit-tfassil ta 'dokumenti html

Billi toħloq is-sit tiegħek u timlaha b'ċerti elementi ta 'paġna web, kulħadd żgur jiltaqa' ma 'kunċett bħal selettur tas-CSS. Dan iservi biex jiddetermina b'mod preċiż l-elementi kollha tal-fajl html, id-disinn u l-post tagħhom fuq il-paġna. Biex tagħmel dan, toħloq dokument CSS, li jippreskrivi dawk jew seletturi oħra u parametri għall-ifformattjar tagħhom: kulur, daqs, pożizzjoni, u oħrajn. Kull web designer għandu jkun jaf u jkun jista 'jidħol sewwa fis-seletturi mixtieqa. Huma maqsuma skond it-tipi, dawk ewlenin li aħna ser nikkunsidraw hawn taħt.

Tipi ta 'seletturi f'CSS

Skont liema element HTML jiġi applikat il-formatting, is-selettur CSS jista 'jirreferi għal wieħed mill-gruppi li ġejjin:

• Is-selettur tat-tikketti;
• Selettur tal-klassi;
• Id-selettur;
• Selettur ta 'attribut.

Selettur Tag

Huwa wkoll imsejjaħ "selettur tat-tip" jew "skont l-element", huwa l-aktar sempliċi u l-iktar komuni. Kif isimha fid-dokument CSS huma l-ismijiet ta 'dawk l-elementi tal-fajl html li niddeskrivu. Per eżempju, jekk irridu nispeċifikaw stil ta 'paragrafu, aħna nispeċifikaw il-proprjetajiet u l-valuri tagħhom għall-p {isfond: x; Kulur: y; Daqs: z}. F'dan il-każ, il-paragrafi kollha tal-paġna web għandhom l-istess formatting (kulur fl-isfond, test, daqs, eċċ.).

Selettur tal-klassi

U x'jiġri jekk ikollok bżonn issettja l-istil tiegħek differenti għal oħrajn għal kull paragrafu? Għal dan, hemm selettur tal-klassi.

Id-dokument CSS f'dan il-każ ikun fih l-annotazzjoni li ġejja: p.first {color: x; Id-daqs tal-font: y}. Għalhekk, waqqafna l-proprjetajiet "kulur" u "daqs" biss għall-ewwel paragrafu tal-klassi.

Fid-dokument html f'dan il-każ, inti tidħol l-attribut tal-klassi bl-isem tal-istil l-ewwel. Il-klassijiet jistgħu jkunu kemm jista 'jkun l-istili li trid tapplika għal elementi ta' paġna web.

Selettur bl-id

Ħafna drabi hemm bżonn li l-istil jiġi definit b'mod aktar preċiż, pereżempju, għal element wieħed tal-paġna jew għall-kampjun tagħhom. F'din is-sitwazzjoni, l-id-selettur jasal sal-salvataġġ. Fil-fajl html, aħna nassenjaw l-isem lill-element mixtieq, u nidentifikawh fost l-oħrajn. Pereżempju, l-element li rridu nistabbilixxu differenti mill-istil l-ieħor se jkun it-titlu tal-artiklu.

Imbagħad fid-dokument html nassenjaw l-identifikatur h1 għall-intestatura, pereżempju l-isem tal-isem. U fil-fajl CSS, issettja l-istil billi żżid kannizzata qabel l-isem tal-identifikatur: #articlename {kulur: blu; L-allinjament tat-test: center}. Issa l-intestatura tagħna se jkollha l-kulur ikħal u l-allinjament taċ-ċentru.

Kull wieħed mit-tipi ta 'hawn fuq jista' jissejjaħ "selettur CSS sempliċi". Huma jiddefinixxu l-ifformattjar għal parametru partikolari ta 'dokument html: ġabra ta' elementi simili (per eżempju, il-paragrafi kollha ta 'oġġett), klassi waħda (per eżempju, l-ewwel paragrafu biss) jew element speċifiku (per eżempju, titolu ta' oġġett).

Selettur ta 'attribut

Minbarra dak ta 'hawn fuq, hemm seletturi ta' attributi CSS - mod aktar kumpless ta 'applikazzjoni ta' stili. Jippermetti li format elementi html mill-attribut magħżul jew il-valur tiegħu. Hemm diversi varjetajiet ta 'dan is-selettur:

• Bil-preżenza ta 'attribut;
• Bil-valur preċiż tiegħu;
• B'valur ta 'attribut parzjali;
• Permezz tat-tifsira speċifika tiegħu.

Ejjew nikkunsidraw fid-dettall kull waħda minn dawn il-varjetajiet:

1. L-ewwel każ. L-ifformattjar jintuża jekk ikun hemm attribut speċifiku fil-kodiċi html (jistgħu jkunu p, div, header, eċċ.). Jekk tkun nieqsa, jintuża stil universali għall-elementi kollha. Pereżempju, għal oġġetti li għandhom titolu (tooltip).
2. It-tieni każ. L-istil japplika biss għal dawk l-elementi html li għandhom logħbiet eżatti ta 'valuri ta' attributi. Per eżempju, għal dawk l-elementi ta 'input li l-valur tal-attribut tat-tip huwa ugwali biex jissottomettu.
3. It-tielet każ. L-ifformattjar huwa ristrett għal oġġetti b'kelma speċifika fil-lista ta 'valuri. Per eżempju, sideBar fl-attribut "klassi" ta 'elementi div.
4. Ir-raba 'każ. L-istil huwa speċifikat biss għal dawk l-elementi tad-dokument html, li għalihom attribut partikolari għandu ċertu valur u jibda miegħu. Pereżempju, l-applikazzjoni tal-kulur speċifikat għall-elementi kollha li l-lingwa tal-attributi tagħhom hija Ingliża (dan jista 'jkun en, en-rus, en-au, eċċ.).

Għalhekk, bl-użu ta 'selettur CSS partikolari, tista' tiddisinja l-aħjar il-paġna web kollha u tiddeskrivi l-elementi individwali tagħha.