Cum se configurează smartphone-uri și PC-uri. Portal informativ

Atribute HTML. Atribute HTML: tipuri și utilizări

Ne-am uitat la un exemplu de creare a unei pagini simple, în care au fost date comentarii la unele etichete html, deoarece mi se pare că este mai bine să arătăm mai întâi ceva cu un exemplu, apoi să trecem la o descriere mai detaliată. De aceea, crearea paginii a fost tratată în a doua lecție, iar mai detaliat în a treia.

Deci, mai jos sunt descrieri ale etichetelor HTML comune care sunt folosite pe aproape fiecare pagină a site-ului. Crede-mă, sunt deja destui pentru a scrie un întreg site.

Lista de etichete HTML

1. Etichetă HTML (pentru paragrafe)

- afișează un paragraf text (permite atribute stil, clasă, id). Cea mai comună etichetă, deoarece textul este plasat cel mai adesea în ea (deși a fost creat pentru aceasta).

De exemplu, codul html:

Text paragraful numărul unu

Și acesta este un alt paragraf

Text paragraful numărul unu

Și acesta este un alt paragraf

De asemenea, puteți adăuga parametrul de stil la etichetă:

Cu aceste valori diferite, puteți edita aspectul fontului. Puteți citi despre acești parametri într-o lecție separată: stiluri în html și proprietatea fontului css.

De asemenea, puteți scrie atributele CLASS și ID. De exemplu:

2. Etichetă HTML și(îndrăzneţ)

ȘI - două etichete pentru a face fontul aldine. Nu există nicio diferență între aceste etichete.

Să dăm un exemplu. Cod HTML:

miniatură

Convertit pe pagină în următoarele:

miniatură

De asemenea, puteți înregistra atributele CLASS și ID (ca și în cazul Note

Aceste etichete au un impact redus asupra clasamentului documentelor în motoarele de căutare, așa că este mai bine să nu le folosiți fără scop.

3. Etichetă HTML (creați cursive)

- font italic (permite parametrii stil, clasă, id)

De exemplu, codul html:

text italic

Convertit pe pagină în următoarele:

4. Etichetă HTML (text subliniat)

- font subliniat (permite stilul parametrilor, clasă, id)

De exemplu, codul html:

text subliniat

Convertit pe pagină în următoarele:

text subliniat

5. Etichetă HTML (crearea unui hyperlink)

Creează un link pe pagină (acceptă stilul, clasa și altele).

De exemplu, codul html:

textul linkului

Convertit pe pagină în următoarele:

Toți parametrii și atributele etichetei va fi discutat într-o lecție separată: etichetă html.

6. Etichetă HTML

(titluri în conținut)

,...,
- etichete de titlu în interiorul conținutului (permite stilul, clasa, parametrul id). Mai mult, cu cât numărul este mai mic, cu atât textul inclus în aceste etichete are mai multă greutate și dimensiune (în mod implicit).

De exemplu, codul html:

Titlul H1

Etichetă

folosit pentru titlul paginii (precum și pentru titlu)

Utilizați aceste etichete numai în scopul propus, de exemplu. numai atunci când articolul are nevoie de un titlu. Acest lucru se datorează faptului că etichetele

,...,
au un impact mare asupra motoarelor de căutare. Dacă este folosit corect, șansele de a ajunge în partea de sus a rezultatelor căutării sunt foarte mari.

7. Etichetă HTML
(aliniere)

- aliniază conținutul la centru.

De exemplu, codul html:

Acest text va fi în centru

Convertit pe pagină în următoarele:

Acest text va fi în centru

Notă
  • - pentru text
  • ...
    - pentru orice (de exemplu, imagine)

8. Etichetă HTML (indice)

- afișează un font indice.

De exemplu, codul html:

Text simplu, indicele

Convertit pe pagină în următoarele:

Text simplu, text indice

9. Etichetă HTML (superscript)

- afișează un font superscript.

De exemplu, codul html:

Text simplu, superscript

Convertit pe pagină în următoarele:

Text simplu, text în indicele

10. Etichetă HTML ,

, - afișează fontul cu un pixel mai mult/mai puțin decât dimensiunea curentă (permite parametrul stil, clasă, id).

De exemplu, codul html:

font obișnuit, acest font este cu un pixel mai mare

Convertit pe pagină în următoarele:

Font obișnuit, acest font este cu un pixel mai mare

11. Etichetă HTML
    (crearea listelor)

Liste (acceptă stil, clasă, parametri id). Fiecare element nou este înregistrat între

  • și
  • .

    De exemplu, codul html:

    Listă:
    • primul element al listei
    • al doilea element al listei

    Convertit pe pagină în următoarele:

    Listă:

    • primul element al listei
    • al doilea element al listei

    12. Etichetă HTML (crearea de tabele)

    - creează un tabel (permite stilul, parametrul de clasă). Fiecare linie nouă este creată cu etichete iar coloana .

    De exemplu, codul html:

    1 rând 1 element1-rând 2 element
    2 rânduri 1 element2 rânduri 2 element

    Convertit pe pagină în următoarele:

    Toate caracteristicile etichetei

    13. Etichetă HTML
    (rupere de linie)


    - mergeți la linia următoare, este o singură etichetă.

    De exemplu, codul html:

    Linia 1
    2 linii
    3 linii Și acest text va fi pe a 3-a linie, deoarece nu a existat tranziție

    Convertit pe pagină în următoarele:

    1-șir
    2 linii
    3-line Și acest text va fi pe a 3-a linie, deoarece nu a existat nicio tranziție

    14. Etichetă HTML
    (linie orizontală)


    - desenează o linie, este o singură etichetă (permite stilul, parametrul de clasă).

    De exemplu, codul html:

    Un text deasupra liniei
    Și acest text va fi deja sub linie

    Convertit pe pagină în următoarele:

    Un text deasupra liniei Și acest text va fi deja sub linie

    15. Etichetă HTML (ieșire imagine)

    De exemplu, codul html:

    http://img-fotki.yandex.ru/get/5821/27743399.2b/0_8875d_14383ca6_M.jpg">

    Convertit pe pagină în următoarele:

    Toate caracteristicile etichetei va fi discutat într-o lecție separată:.

    16. Etichetă HTML (formatarea textului)

    - pentru formatarea textului, schimbarea stilului etc. (permite stilul parametrului, clasă, id). Greutatea sa în ochii motoarelor de căutare este absentă, așa că îl puteți folosi cât doriți.

    De exemplu, codul html:

    Acest text este verde și dimensiunea lui este de 15 px.

    Convertit pe pagină în următoarele:

    Notă

    O etichetă similară este.

    17. Etichetă HTML
    (crearea formularului)

    - crearea unui formular pe pagină (permite stilul, parametrul de clasă).

    De exemplu, introducerea unui nume de utilizator și a unei parole, orice butoane, orice formular de înregistrare - toate acestea sunt formulare.

    18. Etichetă HTML
    (crearea blocurilor)

    - servește la crearea blocurilor pe pagină (permite stilul, parametrul de clasă). Anterior, tabelele erau folosite în principal pentru aspectul pe pagini. După ce apare eticheta
    sarcina a fost simplificată. Aproape toate site-urile conțin
    blocuri ca o alternativă convenabilă la mese.

    Etichete și atribute:

    Există două tipuri de etichete HTML - etichete container și etichete simple, care sunt întotdeauna incluse între paranteze unghiulare<...>.

    Etichetele containerului constau dintr-o pereche - etichete de deschidere și de închidere<...>...... Înainte de numele etichetei de final, trebuie folosită o bară oblică (slash) „/”. În eticheta de închidere, nu trebuie să scrieți atributele prezente în eticheta de deschidere!

    Etichetele unice sunt mai puțin comune și constau doar dintr-o etichetă de deschidere. Exemplu:
    .

    O etichetă poate avea atribute și valori ale atributelor. Exemplu: <тег имя_атрибута_1="значение" имя_атрибута_2="значение">... ... Atributele sunt adăugate unei etichete pentru a extinde sau modifica acțiunile acesteia.

    Etichete și atribute

    „_blank” - va deschide documentul într-o fereastră nouă.
    „_parent” - va deschide documentul în cadrul părinte. Dacă nu, se va deschide în fereastra curentă.
    „_top” - anulează toate cadrele și încarcă pagina în fereastra completă a browserului, dacă nu există cadre, o deschide în fereastra curentă.
    „_self” - se va deschide în fereastra curentă (implicit pentru linkuri).

    Etichetă: [singur]

    Metainformații. Servește în principal pentru roboții de căutare. Atribute și valori:

    Descrierea documentului.
    Cuvinte cheie.
    Managementul procesului de indexare. Opțiuni posibile:

    „index” - capacitatea de a indexa acest document. Dimpotrivă - „noindex”
    „follow” - capacitatea de a indexa toate documentele la care se face referire în acest fișier HTML. Dimpotrivă - „nofollow”
    „toate” este o condiție simultană a celor două de mai sus.
    „niciunul” - o condiție simultană a primelor două. Viceversa.

    Codificarea documentelor.
    Indică faptul că documentul trebuie reîncărcat după 30 de secunde.

    Etichetă: - Foaie de stil globală. Scris în etichetă .
    3] exemplu- Tabel de stiluri interne. Este înregistrată în etichetă.

    Etichetă:

    [container]

    Creează un tabel. Etichete necesare:

    ... Exemplu:

    ,




    Exemplu

    Atribute posibile de etichetă:

    Setează grosimea cadrului. de la 0 la...
    Setează culoarea chenarului.
    Distanța dintre celulele tabelului. de la 0 la...
    Distanța dintre conținutul celulei și marginea acesteia. de la 0 la...
    Lățimea mesei. de la 0 la...
    Înălțimea mesei. de la 0 la...

    Etichetă:

    [container]

    Creează un rând într-un tabel. Atribute valide:

    Setează alinierea orizontală a celulelor din tabel. Valori valide:

    „stânga” - aliniere la stânga.
    „centru” - aliniere la centru.
    „dreapta” - aliniere la dreapta.
    „justificare” - alinierea testului pe întreaga linie.

    Setează alinierea verticală a celulelor din tabel. Valori valide:

    „sus” - aliniere de sus.
    „mijloc” - alinierea la centru.
    „de jos” - alinierea la marginea de jos.

    Setează culoarea de fundal.

    Etichetă:

    [container]

    Creează o celulă într-un tabel. Atribute valide: , , , , ...

    Specifică numărul de coloane care sunt combinate într-o singură celulă. De la 1 la...
    Indică numărul de linii care sunt combinate într-o celulă. De la 1 la...

    Etichetă:

    [container]

    Specifică titlul tabelului. O celulă normală cu text aldine centrat.

    Etichetă:

    [container]

    Creează un paragraf nou. La întâlnirea acestei etichete, browserul continuă textul pe o nouă linie.
    Atribute posibile: .

    Etichetă: [container]

    Setează titlul.

    ...

    - cel mai mare titlu.
    ...
    - cel mai mic titlu.
    Atribute posibile: .

    Etichetă:
    [singur]

    Încheie textul într-o nouă linie.

    Etichetă: [singur]

    Dezactivează fluxul de linie.

    Etichetă: [container]

    Creează text aldine. exemplu .

    Etichetă: [container]

    Creează text subliniat. exemplu .

    Etichetă: [container]

    Creează text italic. exemplu .

    Etichetă: [container]

    exemplu .

    Etichetă: [container]

    Creează text care simulează stilul unei mașini de scris. exemplu .

    Etichetă: [container]

    Text italic (perceput de roboții de căutare ca o selecție).

    Etichetă: [container]

    Text îngroșat (perceput de roboții de căutare ca o selecție deosebit de puternică).

    Etichetă:


    [singur]

    Adaugă o linie orizontală documentului HTML. Atribute posibile:


    Creează o linie fără umbră.

    Setează înălțimea (grosimea) liniei.

    Setează lățimea liniei.

    Setează alinierea orizontală în tabel.

    Setează liniile la o anumită culoare.

    Etichetă: [container]

    Setează indicele în text. Exemplu: H 2 O.

    Etichetă: [container]

    Setează indicele în text. Exemplul c 2 = a 2 + b 2.

    Etichetă: [container]

    Folosit pentru a formata text. Nu funcționează fără atribute. Atribute posibile:

    Indică un font.
    Setează dimensiunea textului. 1 la 7.
    Setează textul la o anumită culoare.

    Etichetă: [container]

    Indică calea către altă pagină.
    Specifică în ce fereastră se deschide hyperlinkul.
    Afișează un sfat explicativ când treceți cu mouse-ul peste un link.
    Deschide un program de e-mail cu EMAIL-ul specificat.
    Marchează o porțiune a textului ca etichetă pentru hyperlinkurile de pe o pagină. Servește drept ancoră.
    Specifică calea către ancoră.

    HTML este un limbaj de marcare hipertext. Se bazează pe așa-numitele etichete. Etichetele sunt un fel de elemente wrapper care stabilesc formatul și proprietățile elementelor pe o pagină web. Pe o singură pagină, am creat o referință actualizată a etichetei HTML pentru dvs.

    Există peste o sută de elemente de marcare în total. Fiecare are un număr de atribute și propria sa sintaxă. Referința etichetelor HTML vă ajută să găsiți rapid elementul dorit.

    Lista etichetelor HTML

    Mai jos în tabel este o listă de etichete HTML5 cu o scurtă descriere în limba rusă.

    Etichetă Scurta descriere
    Un comentariu.
    Definește tipul de document.
    Link, hyperlink, ancora.
    Definește textul ca o abreviere.
    Informații de contact pentru autorul sau proprietarul documentului.
    Definește o zonă pe o hartă imagine
    Articol
    Conținut deoparte (conținutul nu este principal pe pagină prin semnificație)
    Vă permite să introduceți un fișier audio care poate fi redat.
    Text îngroșat.
    Specifică adresa URL de bază sau atributul țintă pentru legăturile relative din document.
    O zonă în care scrierea textului poate lua o direcție diferită.
    Stabilește direcția de scriere a textului. Spre deosebire de direcția indică direcția fizică
    Citat.
    Indică regiunea corpului documentului.

    Rupere de linie.
    Buton pe care se poate face clic
    Folosit pentru desenarea graficelor folosind scripturi
    Semnătura de masă.
    O notă de subsol la numele materialului.
    Folosit pentru a introduce codul computerului sub formă de text.
    Specifică caracteristicile coloanelor din tabel.
    Specifică un grup de una sau mai multe coloane de tabel de format.
    Folosit pentru a defini opțiuni predefinite atunci când tastați într-o casetă de text
    Definește o descriere a unui termen dintr-o etichetă
    în lista de termeni
    Text care a fost eliminat într-o versiune mai nouă a documentului.
    Definește informații suplimentare pe care utilizatorul le poate vizualiza sau ascunde
    Indică faptul că conținutul este un termen.
    Definește o casetă de dialog sau un element interactiv
    Elementul bloc este unul dintre elementele principale ale layout-ului.
    Definește o listă de definiții
    Numele termenului din lista de definiții
    text evidențiat (de obicei text italic).
    Recipient pentru aplicare externă
    Un grup de articole înrudite într-un formular
    Titlu pentru
    element
    Definește un grup autonom de mai multe elemente (de exemplu, o imagine cu o legendă)
    subsol
    Definește forma de intrare de utilizator

    -

    Diferite niveluri de titluri HTML:

    ,

    ,

    ,

    ,

    ,
    .
    Indică zona capului documentului.
    Blocul de titlu

    Linia orizontală este un separator tematic.
    Element rădăcină. Spune browserului că documentul dat este un document HTML.
    Textul cu caractere italice.