Comunicate de Afaceri

10 lucruri interesante pe care le pot face etichetele HTML

În acest moment există un total de 142 de elemente HTML standardizate de W3C excluzând cele aflate în fazele inițiale de standardizare și cele care au devenit învechite. Acestea fiind spuse, este posibil să ratezi sau să uiți câteva dintre ele care pot fi utile atunci când este nevoie.

Mai devreme am făcut o recapitulare a unora dintre cele mai bune trucuri CSS pe care s-ar putea să le fi trecut cu vederea. Această postare vă va aminti câteva dintre etichetele HTML pe care nu știați că le puteți folosi pentru a implementa funcții precum:

 

1. Imagini de hartă

Elementele HTML <map>pot fi folosite pentru a crea hărți imagine. Hărțile de imagine sunt în principiu imagini cu zone pe care se poate face clic pe ele, care pot fi hyperlinkate către o altă pagină web sau alte părți ale aceluiași document. Puteți defini ce zone ale unei imagini se pot face clic, menționând pur și simplu coordonatele XY corespunzătoare ale acelor puncte în <area>elementele imbricate în interior <map>.

Notă: Zonele pe care se poate face clic nu pot fi stilate prin CSS, așa că, dacă doriți ca acești marcatori să fie stilați, utilizați un software simplu de editare a imaginilor pentru a desena marcajele.

Sfat: Dacă doriți să cunoașteți coordonatele unui punct dintr-o imagine, deschideți imaginea într-un software de editare a imaginii și mutați cursorul în acel punct, ar trebui să puteți vedea coordonatele acestuia în software-ul însuși. Pentru GIMP este afișat în partea stângă a barei de jos.

2. Sugestii de intrare

Utilizați <datalist>pentru a furniza o listă de sugestii relevante care apar în timp ce introduceți o valoare de intrare.

3. Evidențiați Text

Textul evidențiat are de obicei o culoare închisă a textului cu un fundal deschis. Puteți obține acel efect de text evidențiat doar cu marcaj. Orice text inclus în interiorul <mark>va avea acest efect.

Puteți personaliza culoarea de evidențiere cu background-colorproprietatea CSS a <mark>și culoarea textului cu colorproprietatea.

4. Definiți șabloane

Odată cu HTML5 a apărut și noul <template>element. Elementul <template>deține în interiorul său un marcaj care nu este redat de browsere, marcajele incluse în acesta urmează să fie utilizate pentru a genera conținut dinamic în pagină folosind JavaScript .

De exemplu, să presupunem că aveți un <table>loc unde rândurile trebuie adăugate dinamic, puteți pur și simplu să puneți marcajul unui rând gol al acelui tabel în interiorul <template>etichetei și, atunci când este necesar, să apelați o funcție JavaScript care conține script pentru a copia marcajul din interiorul etichetelor șablonului și adăugați-l la marcajul tabelului. Acest lucru nu este acceptat de IE.

5. Tipărire fina

Imprimarea fină se referă la textul documentului care este tipărit în mod obișnuit în dimensiuni foarte mici, care conține informații precum condiții, termeni, restricții, citate, drepturi legale etc. <small>Eticheta în HTML poate fi folosită pentru a afișa amprente fine. Începând cu HTML5, <small>eticheta nu numai că afișează un text cu tipărire fine, ci va defini și din punct de vedere semantic la fel ca declinările legale și avertismentele.

6. Atribuiți o adresă URL de bază

Elementul <base>HTML este destul de util atunci când aveți mai multe link-uri în documentul dvs. cu aceleași adrese URL de domeniu, vă permite să adăugați o adresă URL de bază la document care, la rândul său, vă permite să adăugați numai adrese URL relative la alte link-uri din pagină, după cum este necesar.

Notă: Toate adresele URL relative din pagină vor fi referite pe baza adresei URL de bază, dacă aveți vreun link cu un alt domeniu, nu uitați să îi atribuiți adresa URL completă.

7. Imagini receptive

Dezvoltarea web responsive este în vogă cu accesul mobil din ce în ce mai mare. Imaginile pot fi comutate pentru diferite dimensiuni de ecran cu marcaj. Elementul <picture>HTML5 vă permite să adăugați diverse surse de imagine pentru diferite medii pentru imaginea din interiorul acestuia.

Notă: acest lucru funcționează în prezent numai în Chrome. Va trebui să setați dom.image.picture.enableîn trueFirefox about:config.

8. Selector de culoare

HTML5 a introdus multe elemente noi de tip de intrare ; elementul de intrare a culorii este unul dintre ele. Vă permite să alegeți o culoare pe o pagină web cu ajutorul unui selector de culori.

9. Opțiuni de grup

Dacă aveți multe opțiuni într-o listă derulantă și doriți să le afișați grupate, <optgroup>elementul își va face treaba. De asemenea, puteți stila grupurile cu CSS.

10. <noscript>Elementul

Markup-ul din interior <noscript>este redat de browser numai atunci când scriptul este dezactivat. Această etichetă este utilă pentru a informa utilizatorii când scriptul este dezactivat în browserul lor și pentru a oferi orice mecanism alternativ de rezervă pentru componentele din paginile web care nu vor mai funcționa fără JavaScript.

AllmaDesign vă oferă servicii profesionale de web design la prețuri avantajoase, creare site-uri prezentare pentru companii mici și mijlocii, creare magazine online și cataloage de produse, precum și alte servicii conexe: întreținere și administrare site-uri weboptimizare SEO și promovare onlinedesign grafic și identitate companiegăzduire web și înregistrare nume de domenii.

Download fisiere
Social Media
Vezi toate articolele autorului: AllmaDesign

Comentarii

Cauta

Categorii populare