CSS-selektor, a njegova uloga u oblikovanje HTML-dokumenta

Izrada web stranica i punjenje s nekim elementima web stranice, svatko će naići na pojam kao što su CSS-selektora. Ona služi za preciznije odrediti sve elemente HTML-datoteku njihovog dizajna i mjesto na stranici. Da biste to učinili, stvoriti CSS-dokument koji navodi određene selektora i njihove mogućnosti oblikovanja: boju, veličinu, položaj i druge. Svaki web dizajner trebao znati i biti u mogućnosti da pravilno unesete željene odabir. Oni su podijeljeni po vrsti, glavni od kojih smo raspravljati u nastavku.

Vrste selektora u CSS

Ovisno o kojemu je element primjenjuje HTML formatu, CSS-selektor može se odnositi na jednu od sljedećih skupina:

• Selektor oznaka;
• Selektor klase;
• id-selektor;
• atribut selektor.

selektor oznaka

To se također naziva „tipa selektor” ili „elementa”, to je najviše jednostavan i čest. Kao što je njegov CSS-dokumentu su imena elemenata HTML-datoteku, koju opisuju. Na primjer, ako nam je potrebno postaviti stavak stil, mi odrediti svojstva i njihove vrijednosti za element p {background: x; boja: y; Veličina: z}. U tom slučaju, svi stavci web stranice će imati isti format (boju pozadine, veličinu teksta, itd. D.).

selektor razred

A što ako je potrebno pitati svaki tvoj stav se razlikuje od drugih stilova? Da biste to učinili, tu je selektor klase.

CSS-dokument u tom slučaju bi sadržavati unos sljedećem obliku: p.first {color: x; font-size: y}. Dakle, definiramo svojstva „boju” i „veličina” samo za prvi razred stavka.

U HTML-dokumenta u ovom slučaju ušli u razred atribut ime stila prve. Klase može biti onoliko koliko stilu koji želite podnijeti zahtjev za web-stranicu elemenata.

selektor id

Često postoji potreba da se definira stil točnije, na primjer, bilo jednog elementa na stranici, ili ih probati. U takvoj situaciji, pomoć dolazi id-izbornik. HTML datoteku dodijeliti željeni naziv stavke koje ga identificira među ostalima. Na primjer, elementi koje želimo postaviti drugačiji od drugih stilu će biti naslov članka.

Zatim se u HTML-dokument dodjeljivanje identifikatora u zaglavlje H1, kao articlename. A u CSS-datoteku, odrediti stil, dodajući da je ID imenom rešetke: #articlename {boja: plava; text-align: centar}. Sada naš naslov će imati plava boja i usmjeren.

Svaki od navedenih tipova može se opisati kao „jednostavan CSS-selektora”. Oni definiraju oblikovanje za određeni parametar HTML-dokumenta: zajedno slične elemente (npr svi stavaka članka), jedan razred (na primjer, samo prvi stavak) ili određenu stavku (na primjer, naslov članka).

atribut selektora

Osim navedenog, tu je CSS-selektora atribute - složeniji način primjene stilova. To omogućuje html elemente formata na odabranom atribut ili vrijednost. Postoji nekoliko varijanti ovog izbornika:

• prisutnost atributa;
• na svojoj točnu vrijednost;
• djelomičnom vrijednosti atributa;
• na njegovu određenu vrijednost.

Razmotrimo svaku od ovih vrsta:

1. Prvi slučaj. Oblikovanje se primjenjuje, ako je prisutna u određenoj atributa HTML-koda (to može biti p, div, zaglavlje, itd.) Ako to nije slučaj, on koristi generički za sve elemente stila. Na primjer, elementi koji imaju naslova (alat tip).
2. Drugi slučaj. Stil se odnosi samo na html elemenata koji imaju točno podudaranje s vrijednostima atributa. Na primjer, za unos u elementima, gdje je vrijednost tipa atributa jednak podnijeti.
3. Treći slučaj. Pod formatu samo će uključivati stavke u popis vrijednosti koje ima određenu riječ. Na primjer, Bočna atribut „klasa” za elemente div.
4. Četvrti slučaj. Stil je definirana samo za one elemente HTML-dokumenta, čiji je posebno svojstvo ima određenu vrijednost, a počinje s njim. Na primjer, korištenje određene boje na svim elementima koji su engleski jezik atribut (koji može biti hr, en-rus, hr-au i t. D.).

Dakle, pomoću jedne ili druge strane, selektor CSS, može najbolje biti naveden kao cijeli web stranice, i opisati neke od njegovih elemenata.