CSS-valitsin, ja sen rooli muotoilun html-dokumentti

click fraud protection

Luominen sivuston ja sen täyttö tiettyjä osia Web-sivun, jokainen joutuu termi, kuten CSS-valitsimen.Se palvelee tarkimmin määrittää kaikki osatekijät html-tiedot niiden suunnittelu ja sijainti sivulla.Voit tehdä tämän, luoda CSS-asiakirjan, jossa tietyt valitsimet ja niiden muotoilua vaihtoehtoja: väri, koko, sijainti, ja muut.Jokainen web-suunnittelija pitäisi tietää ja voi kunnolla päivämäärät valitsimista.Ne jaetaan tyypin, tärkein joista keskustelemme alla.

Tyypit valitsimia CSS

Riippuen siitä, missä html-elementti koskee muotoilua, CSS-valitsin voi viitata johonkin seuraavista ryhmistä:

  • valitsin tunnisteet;
  • luokka valitsin;
  • id-valitsin;
  • valitsin attribuutteja.

tag valitsin

Sitä kutsutaan myös "valitsin" ja "lähetykseen", se on yksinkertainen ja yhteisiä.Hänen CSS-asiakirjassa ovat nimet elementtien html-tiedosto, joka kuvaamme.Esimerkiksi, jos meidän asettaa kappaleen tyyli, me määrittää ominaisuuksia ja niiden arvoja elementin p {background: x;väri: y;size: z}.Tässä tapauksessa kaikki kappaleet verkkosivu on sama formaatti (taustaväri, tekstin kokoa ja vastaavat. D.).

luokkatarkennettuna

Mutta entä jos sinun täytyy kysyä teidän jokaisen kappaleen eroaa muista tyylejä?Tätä varten on luokka valitsin.

CSS-asiakirjaa tässä tapauksessa, sisältää merkinnän seuraavan kaltainen: p.first {color: x;font-size: y}.Näin me määrittelemme ominaisuudet "väri" ja "koko" vain kohtaan luokan ensin.

html-asiakirjassa tässä tapauksessa, kirjoita luokan attribuutin nimen tyyliä ensin.Luokat voivat olla jopa tyyliä haluat hakea sivun elementtejä.

valitsin tunniste

Usein on tarpeen määritellä tyyli tarkemmin, esimerkiksi jonkin elementin sivun tai niiden näytteessä.Tässä tilanteessa tuki on id-valitsin.Html-tiedosto määrittää halutun kohteen nimi, joka yksilöi sen muiden joukossa.Esimerkiksi elementti että haluamme asettaa tyyliin erilainen kuin muut, tulee otsikko artikkeli.

Sitten liittää html-asiakirjan otsikon H1 tunnisteen, kuten articlename.Ja CSS-tiedosto määrittää tyylin, lisäämällä nimitunnisteeseen säleikkö: #articlename {color: blue;text-align: center}.Nyt meidän otsikko on sininen väri ja keskitetty.

Kumpikin edellä tyyppejä voidaan kutsua "yksinkertainen CSS-valitsin."Niissä määritellään muotoilua tietyn parametrin html-asiakirjan yhdessä samanlaisia ​​elementtejä (esimerkiksi kaikki kappaleet artikkelin), yksi luokka (esimerkiksi vain ensimmäisen kappaleen) tai tietyn kohteen (esimerkiksi artikkelin otsikko).

valitsin attribuutteja

lisäksi edellä, on CSS-in attribuuttivalitsimien - kehittyneempi tapa käyttää tyylejä.Se mahdollistaa html muotoilun elementtejä valitun ominaisuuden tai arvoa.On olemassa useita erilaisia ​​tämän valitsimen:

  • läsnäolo attribuutin;
  • sen tarkka arvo;
  • osittaisella määritteen arvo;
  • sen erityisen arvokkaita.

Tarkastellaan kutakin näistä lajikkeista:

  1. ensimmäinen tapaus.Muotoilua käytetään, jos on olemassa erityinen määritteen html-koodia (se voi olla p, div, header, jne).Jos se ei ole, se käyttää yleisiä kaikkien osien tyyliä.Esimerkiksi,-elementit otsikko (tooltip).
  2. toinen tapaus.Tyyli koskee vain html-elementtejä, jotka ovat tarkkoja ottelun määreet.Esimerkiksi sellaisiin tekijöihin panos, joiden arvo Ominaisuuden yhtäläiset esittää.
  3. Kolmas tapaus.Tietyssä muodossa sisältävät vain luettelossa olevat arvot, jotka on tietty sana.Esimerkiksi, sivupalkki määrite "luokka" on elementtejä div.
  4. neljännessä tapauksessa.Tyyli on määritelty ainoastaan ​​niistä html-asiakirjaa, joissa tiettyä määrite on tietty arvo, ja alkaa hänen.Esimerkiksi käyttö tietyn värin kaikkia elementtejä, attribuutteja jonka Englanti kielen (se voi olla en, en-rus, en-au jne. D.).

Siten käyttämällä yhtä tai toisella CSS-valitsin voidaan parhaiten sijoittaa koko web-sivun, ja kuvata eräitä sen osia.