Crearea unui site web și umple-l cu anumite elemente ale unei pagini web, toată lumea se va confrunta cu un termen, cum ar fi CSS-selector.Ea servește pentru a determina cel mai fidel toate elementele html fișier de proiectare și localizarea lor pe pagina.Pentru a face acest lucru, creați un CSS-un document care precizează anumite selectoare și opțiunile lor de formatare: culoare, mărime, poziție, și alte.Fiecare web designer ar trebui să știe și să poată intra în mod corespunzător datele selectoare.Acestea sunt împărțite în funcție de tipul, principalele dintre care vom discuta mai jos.
Tipuri selectoare în CSS
funcție de ceea ce html element aplică formatare, CSS-selector se poate referi la unul dintre următoarele grupuri:
- etichete selector;
- selector clasă;
- id-selector;Selector
- atribute.
selector tag
asemenea, este numit "selector de tip" și "pe elementul", aceasta este cea mai simplă și comune.Ca sa CSS-document sunt numele elementelor html-fișiere pe care le descrie.De exemplu, dacă avem nevoie pentru a seta stilul de paragraf, facem precizarea proprietățile și valorile lor pentru elementul p {background: x;Culoare: y;Dimensiune: Z}.În acest caz, toate punctele pagina web va avea același format (culoarea de fundal, dimensiunea textului și cum ar fi. D.).
selector clasa
Dar dacă aveți nevoie de a pune in fiecare paragraf este diferit de alte stiluri?În acest scop există un selector de clasă.
CSS document în acest caz, va conține o intrare similară cu următoarea: p.first {color: x;font-size: y}.Astfel, definim proprietatile "color" și "dimensiunea" doar pentru un paragraf de clasa întâi.
in html document în acest caz, introduceți atributul de clasă cu numele stilului primul.Clasele pot fi la fel de mult ca și stilul pe care doriți să se aplice pentru elemente de pagină web.
selector id
Adesea este necesar să se definească stilul mai precis, de exemplu pentru orice element parte dintr-o pagină sau în proba de.În această situație, ajutorul vine id-selector.Fișierul HTML atribui un nume de element de dorit ca aceasta identifică printre altele.De exemplu, elementul pe care ne-o dorim pentru a seta un stil diferit de celelalte, va articol titlu.
Apoi atribuiți html document de identificare antet h1, astfel NumeArticol.Și în CSS-fișier pentru a seta stilul, adăugând la grila nume de identificare: #articlename {color: blue;text-align: center}.Acum titlu noastră va fi de culoare albastră și centrat.
Fiecare din tipurile de mai sus poate fi numit "un simplu CSS-selector."Ele definesc formatarea pentru un anumit parametru html document: elemente împreună similare (de exemplu, toate punctele din articol), o clasă (de exemplu, numai primul paragraf) sau un anumit element (de exemplu, titlul articolului).Selector
atribute
lângă cele de mai sus, există, CSS in selectoare atribute - un mod mai sofisticat de a folosi stiluri.Acesta permite elemente de formatare HTML ale unui atribut selectat sau valoare.Există mai multe varietăți ale acestei selector:
- prin prezența unui atribut;
- pe valoarea exactă;
- privind valoarea atributului parțială;
- din valoarea sa deosebită.
Să analizăm fiecare dintre aceste soiuri:
- primul caz.Formatarea se aplică în cazul în care există un atribut specific în html codul (poate fi p, div, antet, etc.).Dacă nu este, foloseste un generic pentru toate elementele stilului.De exemplu, elementele având titlul (tooltip).
- al doilea caz.Stilul se aplică numai în HTML-elemente care sunt exacte un valorile atributelor meci.De exemplu, la acele elemente de intrare, în cazul în care valoarea Tipul caracteristicii egal prezinte.
- al treilea caz.Sub forma va include doar elementele din lista de valori, care are un anumit cuvânt.De exemplu, bara laterală atributul "class", în elemente de div.
- patrulea caz.Stil este definit numai pentru acele elemente html-documente, în care o anumită atribut are o anumită valoare, și începe cu el.De exemplu, utilizarea de culoare specificat pentru toate elementele, atribute care limba engleză (poate fi en, en-Rus, en-au și așa mai departe. D.).
Astfel, folosind una sau alta CSS-selector poate fi cel mai bine plasat într-o pagină web întreg, și descriu unele dintre elementele sale.
