Learning clasa css sau id - care este mai bine, css
Controlați apariția HTML-elemente de pe pagina poate fi folosind mai multe selectoare. ID-ul și de clasă CSS sunt cele mai comune, care ajuta nu numai în crearea de documente HTML marcare. dar, de asemenea, în designul lor (styling).
Cum se aplica ID-ul CSS-selector
selector ID-ul este folosit pentru a desemna un singur HTML element cu valori unice de atribut. Următorul exemplu este prezentat elementul
În CSS, acest element div poate fi utilizat o varietate de stil:
Cum se utilizează selectorul CSS-class
Selector de clasa HTML CSS este folosit pentru a selecta un individ sau un grup întreg de HTML elemente cu o valoare identică a clasei atribut.
În CSS la mai multe paragrafe, puteți aplica diferite stilizare:
Care este diferența CSS Clasa și ID-ul
Celektor id utilizat pentru elemente de pagină individuale (#header), în timp ce clasa de selectare (.content) - multiple. Deoarece valoarea id-ul este dat doar un singur element HTML. Cu alte cuvinte, mai multe elemente nu pot fi de aceeași valoare de identitate într-o singură pagină. De exemplu, poate fi doar un singur element cu id-ul #header. sau un element cu id-#footer.
Aceeași valoare a clasei poate fi setată la unul sau mai multe elemente HTML. De exemplu, este posibil să aveți câteva paragrafe cu .content de clasă sau mai multe link-uri cu .external de clasă.
Următorul exemplu va ajuta să înțeleagă mai bine diferențele dintre clasa CSS si id. precum și să înțeleagă cum să-l folosească:
Cele de mai sus HTML markup am început cu un div-element container. l id (#container) Am cerut, ca singurul container va fi postat pe site-ul nostru. In interior am loc elementele din meniu (#menu) și conținutul (#Content). Așa cum este cazul cu containerul, vom avea doar un singur meniu, și o secțiune de conținut. În interior sunt amplasate cele patru linkuri din meniu , dar fiecare dintre ele am aplicat clasa CSS (.link). În mod similar, am folosit o clasa (.text) la fiecare paragraf în conținutul elementului div.
Dacă doriți să stylize elementele, puteți folosi următorul exemplu:
Atunci când o clasă, iar când ID-ul?
ID-ul este folosit pentru elemente separate, care au loc o singură dată în pagină. De exemplu, titlul, subsol, meniuri și așa mai departe. D. Un selector de clasă este utilizată pentru unul sau mai multe elemente, care apar de mai multe ori pe pagina. De exemplu, paragrafe, link-uri, butoane, elemente de intrare. Deși puteți utiliza clasa pentru un element individual, dar este mai bine să utilizeze aceste selectori la destinație.
De asemenea, trebuie avut în vedere faptul că HTML element poate fi specificat și ID-ul. și clasă. Să presupunem că există două pagini ale blocului cu aceeași dimensiune și stilizarea dar cu o poziționare diferită. În acest caz, puteți aplica aceeași clasă la aceste blocuri pentru a schimba dimensiunea și stilul, apoi utilizați un ID-selector separat pentru fiecare bloc, pentru a le cere de poziționare diferită.
Elementele pot fi, de asemenea, legat de mai multe clase. Acest lucru este foarte util atunci când doriți să aplicați stilul unui grup separat de elemente de un anumit tip. De exemplu, acolo .content clasă. care se aplică la toate punctele. Dacă doriți să adăugați un chenar sau orice alt stil la mai multe paragrafe individuale, o puteți face cu ajutorul p clasă CSS suplimentare .bordered:
Notă spațiul gol dintre cele două nume de clasă în atributul de clasă al doilea paragraf. Mai jos este un exemplu de CSS-cod:
Este important să se utilizeze clasa ID-ul și CSS. ca utilizarea lor necorespunzătoare poate duce la erori în afișarea HTML-cod.
Traducerea articolului „CSS Clasa vs ID: una din ele“ a fost pregătit de către o echipă de proiect prietenos Web design de la A la Z.