InternetWeb Design

CSS selektor, i njegova uloga u oblikovanje HTML-dokument

Stvaranje web stranice i punjenje sa određenim elementima web stranice, svi će se suočiti termin, kao što su CSS selektora. Ona služi da se preciznije odrediti sve elemente HTML-file njihovog dizajna i lokaciju na stranici. Da biste to učinili, stvoriti CSS-dokument koji se navode pojedinih selektora i njihove opcije za formatiranje: boja, veličina, lokacija i drugih. Svaki web dizajner bi trebao znati i biti u mogućnosti da pravilno unesite željenu selekcija. Oni su podijeljeni prema vrsti, glavni od kojih ćemo raspravljati u nastavku.

Vrste selektori u CSS

U zavisnosti od toga na koje se primjenjuje element HTML formatiran, CSS selektor može se odnositi na jednu od sljedećih grupa:

  • tag selektor;
  • Selektor klase;
  • id selektor;
  • pripisuju selektor.

Tag selektor

To se naziva "tip selektor" ili "elementa", to je najjednostavniji i uobičajene. Kao i njegov CSS-dokument su imena elemenata HTML datoteke, koje smo opisali. Na primjer, ako moramo postaviti stil paragrafa, mi navesti svojstva i njihove vrijednosti za element p {background: x; boja: y; Veličina: z}. U ovom slučaju, svi stavovi web stranice će imati isti format (boja pozadine, veličinu teksta, i tako dalje. D.).

selektor klase

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

CSS-dokument u ovom slučaju će sadržavati ulazak sljedeći obrazac: p.first {color: x; font-size: y}. Dakle, mi definirati svojstva "boje" i "veličina" samo za prvu klasu stav.

U HTML-dokument u ovom slučaju je ušla u razred atribut na ime stila prvi. Klase mogu biti onoliko koliko stil koji želite da se prijave za web stranicu elemenata.

selektor id

Često postoji potreba da se preciznije definirati stil, na primer, da bilo koji element stranice, ili da ih uzorku. U ovoj situaciji, pomoć dolazi id selektor. Html datoteku dodijeliti željeno ime stavku da identificira među ostalima. Na primjer, elementi koji želimo postaviti drugačiji od ostalih stil će biti naslov članka.

Zatim u HTML-dokument dodjeljivanje zaglavlje identifikator H1, kao Articlename. A u CSS-file, odredite stil, dodajući da je ID Naziv rešetka: #articlename {color: blue; text-align: centar}. Sada je naš naslov će imati plavu boju i centriran.

Svaki od navedenih vrsta može se opisati kao "jednostavna CSS selektora". Oni definišu oblikovanje za određeni parametar HTML-dokument: zajedno slične elemente (npr sve paragrafe članka), jednu klasu (na primjer, samo u prvom paragrafu) ili određenu stavku (na primjer, naslov članka).

pripisuju selektori

Osim navedenog, postoji i CSS-selektora atribute - komplikovanije način primjene stilova. On omogućava elemente HTML formatu na izabranom atribut ili vrijednost. Postoji nekoliko varijanti ovog selektora:

  • prisustvom atributa;
  • na njen tačan vrijednosti;
  • parcijalnim vrijednost atributa;
  • na specifične vrijednosti.

Razmotrimo svaku od ovih vrsta:

  1. Prvi slučaj. Formatiranje se primjenjuje, ako je prisutna u određenoj atributa HTML-kod (to može biti p, div, zaglavlja, itd.) Ako nije, koristi generički za sve elemente stila. Na primjer, za elemente koji imaju naslov (alat tip).
  2. Drugi slučaj. Stil se odnosi samo na HTML-elemente koji imaju potpuno podudaranje vrijednosti atributa. Na primjer, za unos elemenata, gdje je vrijednost tipa atributa jednaka podnijeti.
  3. Treći slučaj. Pod format samo će uključivati stavke u listi vrijednosti koje ima određenu riječ. Na primjer, sideBar atribut "klase" za elemente div.
  4. Četvrti slučaj. Stil je definiran samo za one elemente HTML-dokumenta, čiji je posebno atribut ima određenu vrijednost, i počinje s njim. Na primjer, korištenje određenom bojom na sve elemente koji jezik atribut English (koja može biti sr, hr-rus, en-au i t. D.).

Na taj način, koristeći jedan ili drugi, CSS selektor, najbolje se može navesti kao cijeli web stranice i opisati neke od njegovih elemenata.

Similar articles

 

 

 

 

Trending Now

 

 

 

 

Newest

Copyright © 2018 bs.birmiss.com. Theme powered by WordPress.