Google

Què són els tags o etiquetes del llenguatge HTML?

 

Cada tag o etiqueta és la unitat bàsica per codificar la representació de la pàgina en el llenguatge de l'HTML. Gairebé qualsevol propietat s'hi especifica. És fàcil localitzar els tags, perquè s'han d'escriure obligatòriament entre claus (< i>). És indiferent utilitzar majúscules i minúscules; hi ha autors que prefereixen les majúscules perquè així localitzen els diferents codis més ràpidament.

Per marcar el final d'un codi aplicat dins de l'HTML cal repetir l'etiqueta inicial amb una barra (/) que identifica el final del codi. D'altra manera, el navegador interpretaria que el codi encara no ha acabat. Si deixam sense tancar un títol en negreta, per exemple, tot el text que segueix quedarà en negreta.

Paràgrafs i espais. Podem introduir tots els espais i separacions de paràgrafs que volguem al text d'un fitxer .htm El navegador ignorarà qualsevol d'ells. Un paràgraf requereix el seu propi codi; un retorn forçat, també; per introduir espais addicionals, cal teclejar el codi &nbsp;. Aquest serveix, per exemple, per sangrar la primera línia d'un paràgraf, o separar paraules segons la nostra conveniència.

Per què em serveix conèixer les etiquetes de l'HTML?

Els editors visuals no són infalibles. De vegades, surten problemes per col.locació d'etiquetes redundants o mal col.locades i la única manera d'esbrinar on és el problema i corregir-lo és donar un cop d'ull al codi HTML amb un editor de text com el bloc de notes o NoteTab.
Bàsics
<html></html>
Crea un document HTML
<head></head>
Defineix l'encapçalat de la fulla, al principi (just davant del tag de <html>) conté el títol i altra informació que no es mostra al navegador.
<body></body>
Defineix la part visible del document.
Encapçalament - etiquetes dins <head>
<title></title>
Defineix el títol del document, tal com apareix a la barra de títol del navegador.
<meta name="keywords" content="?"></meta>
Les etiquetes "Meta" ajuden als cercadors de pàgines en el procés de trobar i indexar la pàgina. Aquí hi podem incloure les paraules clau que volguem fer servir, separades per comes i un espai.
<meta name="description" content="?"></meta>
Aquí hi va la descripció que volguem.
Atributs del cos de la pàgina
<body bgcolor="?">
Serveix per definir el color del fons de la pàgina web. Per exemple, #FFFFFF és blanc.
<body text="?">
Serveix per determinar el color general del text.
<body link="?">
Color dels enllaços.
<body vlink="?">
color dels enllaços que ja ha visitat el navegant.
<body alink="?">
color dels enllaços en el moment en que es faci clic sobre ells.
Codis de text
<pre></pre>
Serveix per crear text pre-formatejat; al qual es mantenen tots els espais que es teclegin i la llargària de línia que faci falta.
<h1></h1>
Crea el títol de tamany major.
<h6></h6>
Crea el subtítol de tamany menor. La resta de subtítols h2...fins a h5 tenen tamanys intermitjos.
<b></b>
posa el text en negreta.
<i></i>
Posa el text en itàlica (cursiva).
<tt></tt>
Crea text de teletip (mecanografiat), elegint una lletra adient, com la courier new.
<cite></cite>
Crea un bloc de text en forma de cita (normalment en itàlica).
<em></em>
dóna èmfasi a un text (normalment en negreta o itàlica).
<strong></strong>
Semblant a l'anterior.
<font face="?"></font>
Permet canviar la lletra, respecte de la que s'ha elegit com a predeterminada.
<font size="?"></font>
Elegeix tamany per a la lletra, amb tamany relatiu creixent (de 1 to 7)
<font color="?"></font>
Canvia el color de la lletra, amb el valor hexadecimal o el nom del color (per als que tenen un nom reconegut per l'HTML, com ara white, orange, red...)
Codis per enllaçar
<a href="URL"></a>
Crea un hiperenllaç.
<a href="mailto:EMAIL"></a>
Crea un enllaç per enviar correu electrònic al destinatari elegit.
<a name="NAME"></a>
Crea un punt d'enllaç dins del document.
<a href="#NAME"></a>
Crea un enllaç amb un punt d'ancoratge com el del tag anterior.
Format de text
<p></p>
Crea un paràgraf nou.
<p align="?">
Especifica l'aliniat d'un paràgraf (left, center, right).
<br>
Inserta un retorn forçat. A diferència del paràgraf, és com si fos el mateix paràgraf, però passat a una nova línia. Qualsevol atribut de paràgraf, com ara <h2>, afectarà més enllà d'aquest retorn.
<blockquote></blockquote>
Sangra el paràgraf a ambdós costats.
<dl></dl>
Crea una llista de definicions.
<dt>
Figura abans de cada definició a una llista de les anteriors.
<dd>
Figura abans de cada definició.
<ol></ol>
Crea una llista numerada.
<li></li>
figura abans de cada element de la llista, i afegeix nombres consecutius.
<ul></ul>
Crea una llista amb "bullets", o vinyetes.
<div align="?">
Una etiqueta que serveix per donar format a blocs llargs de text, i també s'empra per aplicar fulls d'estil.
Elements Gràfics
<img src="name">
Afegeix un enllaç a una imatge.
<img src="name" align="?">
Serveix per aliniar la imatge respecte del text: left, right, center; bottom, top, middle
<img src="name" border="?">
Determina els marges de la imatge.
<img src="name" alt="?">
Col.loca una descripció en text de la imatge. És útil perquè es carrega abans que la imatge i si està desactivada la seva càrrega, es veu una descripció. També apareix en passar per sobre el ratolí.
<hr>
Inserta una línia horitzontal.
<hr size="?">
Serveix per determinar la gruixa de la línia horitzontal.
<hr width="?">
Determina l'amplària de la línia.
<hr noshade>
Crea una línia horitzontal simple, sense ombra
Taules
<table></table>
Crea una taula.
<tr></tr>
Crea cada fila de la taula
<td></td>
Crea cada cel.la de la taula.
<th></th>
Crea l'encapçalament de la taula, una cel.la amb text centrat i en negreta.
Atributs de les Taules
<table border=#>
Defineix el gruix de la línia de la taula
<table cellspacing=#>
Estableix la separació entre cel.les.
<table cellpadding=#>
Estableix una distància entre el marge de la cel.la i el contingut.
<table width=# or %>
Defineix l'amplària de la taula en pixels o en percentatge.
<tr align="?"> or <td align="?">
Alinea al centre, la dreta o l'esquerra les cel.les.
<tr valign="?"> or <td valign="?">
Estableix l'alineament vertical: a dalt, a baix o al centre.
<td colspan=#>
Nombre de cel.les que una columna inclou.
<td rowspan=#>
Nombre de cel.les que inclou una fila.
<td nowrap>
Evita que les línies dins d'una cel.la es trenquin per adaptar-se a l'amplària.