Full de trucs HTML Essentials: etiquetes, atributs i molt més

La creació de pàgines web comença amb HTML. Més endavant, embellir-los i fer-los interactius. Però per començar a crear llocs web estàtics funcionals, cal que entengueu l’HTML. (Voleu una introducció ràpida a aquest llenguatge de marques? Llegiu les nostres preguntes més freqüents sobre HTML.)

Com a part de l’aprenentatge de l’idioma, hi ha una llarga llista d’elements que heu d’afegir al vostre vocabulari HTML. I aquesta tasca pot semblar descoratjadora al principi, i és per això que hem elaborat el següent full de trucs. Us proporciona una manera senzilla de descobrir / entendre / recordar elements HTML sempre que els necessiteu.

---

---

El full de trucs inclou etiquetes i atributs per estructurar pàgines web, formatar text, afegir formularis, imatges, llistes, enllaços i taules. També inclou etiquetes que s’han introduït en codis HTML5 i HTML per a caràcters especials d’ús habitual.

veure dibuixos animats de hanna barbera en línia gratuïts

DESCÀRREGA GRATUITA: Aquest full de trucs està disponible com a PDF descarregable del nostre soci de distribució, TradePub. Haureu de completar un formulari curt per accedir-hi només per primera vegada. descarregar El full de trucs HTML Essentials .

baixar sons personalitzats per a Windows 10

El full de trucs HTML Essentials

......

Drecera	Acció
Etiquetes bàsiques
...	La primera i l'última etiqueta d'un document HTML. La resta d’etiquetes es troben entre aquestes etiquetes d’obertura i de tancament.
...	Especifica la col·lecció de metadades del document.
...	Descriu el títol de la pàgina i apareix a la barra de títol del navegador.
...	Inclou tot el contingut que es mostrarà a la pàgina web.
Informació del document
	Esmenta l'URL base i tots els enllaços relatius al document.
	Per obtenir informació addicional sobre la pàgina com l'autor, la data de publicació, etc.
	Enllaços a elements externs com fulls d'estil.
...	Conté informació sobre l'estil del document, com ara CSS (Cascading Style Sheets).
...	Conté enllaços a scripts externs.
Format de text
... O ...	Fa que el text en negreta.
...	En cursiva i en negreta.
...	En cursiva, però no en negreta.
...	Text ratllat.
...	Cita un autor d’una cita.
...	Etiqueta una part suprimida d'un text.
...	Mostra una secció que s'ha inserit al contingut.
...	Per mostrar cometes. Sovint s’utilitza amb l’etiqueta.
...	Per a pressupostos més curts.
...	Per a abreviatures i formes completes.
...	Especifica les dades de contacte.
...	Per a definicions.
...	Per a fragments de codi.
...	Per escriure subíndexs
...	Per escriure superíndexs.
...	Per reduir la mida del text i marcar informació redundant en HTML5.
Estructura del document
...	Diferents nivells d'encapçalaments. H1 és el més gran i H6 és el més petit.
...	Per dividir contingut en blocs.
...	Inclou elements en línia, com ara una imatge, una icona, una emoticona, sense arruïnar el format de la pàgina.
...	Conté text pla.
	Crea una línia nova.
	Dibuixa una barra horitzontal per mostrar el final de la secció.
Llistes
...	Per a la llista ordenada d’elements.
...	Per a una llista no ordenada d’elements.
...	Per a elements individuals d'una llista.
...	Llista d’elements amb definicions.
...	La definició d’un sol terme en línia amb contingut corporal.
...	La descripció del terme definit.
Enllaços
...	Etiqueta d'ancoratge per als enllaços.
...	Etiqueta per enllaçar a adreces de correu electrònic.
...	Etiqueta d'ancoratge per llistar els números de contacte.
...	Etiqueta d'ancoratge per enllaçar a una altra part de la mateixa pàgina.
...	Navega a una secció div de la pàgina web. (Variació de l'etiqueta anterior)
Imatges
	Per mostrar fitxers d’imatges.
Atributs del fitxer etiqueta
src = url	Enllaç al camí d'origen de la imatge.
alt = text	El text que es mostra quan es posa el ratolí sobre la imatge.
alçada =	Alçada de la imatge en píxels o percentatges.
amplada =	Amplada de la imatge en píxels o percentatges.
alinear =	Alineació relativa de la imatge a la pàgina.
vora =	Gruix de la vora de la imatge.
...	Enllaç a un mapa on es pot fer clic.
...	Nom de la imatge del mapa.
	L'àrea de la imatge d'un mapa d'imatges.
Atributs de l'etiqueta
forma = '	Forma de l'àrea de la imatge.
coords =	Coordenades de la zona de la imatge del mapa.
Formes
...	L'etiqueta principal d'un formulari HTML.
Atributs de l'etiqueta
acció = url	L'URL on s'envien les dades del formulari.
mètode =	Especifica el protocol d’enviament de formularis (POST o GET).
enctype =	L'esquema de codificació de dades per a enviaments POST.
autocompletar	Especifica si l'emplenament automàtic del formulari està activat o desactivat.
novalidar	Especifica si el formulari s'ha de validar abans de l'enviament.
acceptar-conjunts de caràcters	Especifica la codificació de caràcters per a l'enviament de formularis.
objectiu	Mostra on es mostrarà la resposta d’enviament del formulari.
...	Agrupa elements relacionats en el formulari /
...	Especifica què ha d’introduir l’usuari a cada camp de formulari.
...	Un títol per a l'element de camps.
	Especifica quin tipus d'entrada s'ha de prendre de l'usuari.
Atributs de l'etiqueta
tipus =	Determina el tipus d’entrada (text, dates, contrasenya).
nom =	Especifica el nom del camp d'entrada.
valor =	Especifica el valor al camp d'entrada.
mida =	Estableix el nombre de caràcters per al camp d'entrada.
longitud màxima =	Estableix el límit de caràcters d'entrada permesos.
obligatori	Fa obligatori un camp d'entrada.
amplada =	Estableix l'amplada del camp d'entrada en píxels.
alçada =	Estableix l'alçada del camp d'entrada en píxels.
marcador de posició =	Descriu el valor esperat del camp.
patró =	Especifica una expressió regular que es pot utilitzar per buscar patrons al text de l'usuari.
min =	El valor mínim permès per a un element d’entrada.
màx =	El valor màxim permès per a un element d’entrada.
discapacitat	Desactiva l'element d'entrada.
...	Per capturar cadenes de dades més llargues de l'usuari.
...	Especifica una llista d'opcions entre les quals l'usuari pot triar.
Atributs de l'etiqueta
nom =	Especifica el nom d'una llista desplegable.
mida =	Nombre d'opcions donades a l'usuari.
múltiple	Estableix si l'usuari pot triar diverses opcions de la llista.
obligatori	Especifica si cal triar una o més opcions per enviar el formulari.
autofocus	Especifica que una llista desplegable s’enfoca automàticament després de carregar una pàgina.
...	Defineix els elements d'una llista desplegable.
valor =	Mostra el text de qualsevol opció.
seleccionat	Estableix l'opció predeterminada que es mostra.
...	Etiqueta per crear un botó per enviar el formulari.
Objectes i iFrames
...	Descriu el tipus de fitxer incrustat.
Atributs de l'etiqueta
alçada =	L'alçada de l'objecte.
amplada =	Amplada de l'objecte.
tipus =	El tipus de suport que conté l’objecte.
	Un marc en línia per incrustar informació externa.
nom =	El nom de l'iFrame.
src =	L'URL d'origen del contingut dins del marc.
srcdoc =	El contingut HTML dins del marc.
alçada =	L'alçada de l'iFrame.
amplada =	L'amplada de l'iFrame.
	Afegeix paràmetres addicionals per personalitzar l'iFrame.
...	Insereix aplicació o complement extern.
Atributs de l'etiqueta
alçada =	Estableix l'alçada de la incrustació.
amplada =	Estableix l'amplada de la inserció.
tipus =	El tipus o el format de la inserció.
src =	La ruta d'origen del fitxer incrustat.
Taules
...	Defineix tot el contingut d'una taula.
...	Una descripció de la taula.
...	Capçaleres de cada columna de la taula.
Defineix les dades del cos de la taula.
...	Descriu el contingut del peu de pàgina de la taula.
Contingut per a una sola fila.
	...	Les dades d’un únic element de capçalera.
	...	Contingut dins d’una sola cel·la de taula.
...	Agrupa columnes per al format.
	Una sola columna d'informació.
Etiquetes noves HTML5
...	Especifica la capçalera de la pàgina web.
...	Especifica el peu de pàgina de la pàgina web.
...	Marca el contingut principal de la pàgina web.
...	Especifica un article.
...	Especifica el contingut de la barra lateral d'una pàgina.
...	Especifica una secció concreta a la pàgina web.
...	Per descriure informació addicional.
...	S'utilitza com a encapçalament de l'etiqueta anterior. Sempre és visible per a l'usuari.
...	Crea un quadre de diàleg.
...	S'utilitza per incloure gràfics i figures.
...	Descriu un element.
...	Destaca una part específica del text.
...	Conjunt d'enllaços de navegació d'una pàgina web.
...	Un element concret d’una llista o d’un menú.
...	Mesura les dades dins d'un interval determinat.
...	Col·loca una barra de progrés i fa un seguiment del progrés.
...	Mostra text que no admet les anotacions de Ruby.
...	Mostra els detalls dels caràcters de la tipografia de l'Àsia Oriental.
...	Una anotació de rubí per a la tipografia asiàtica oriental.
...	Identifica l’hora i la data.
	Un salt de línia dins del contingut.
¹HTML5 Objectes de caràcters
& # 34; O & Quot;	Cometes
& # 60; O & lt;	Menys que signar (<)
& # 62; O & gt;	Més gran que signe (>)
& # 160; O ;	Espai ininterromput
& # 169; O & copy;	Símbol de copyright
& # 8482; O & ucirc;	Símbol de marca comercial
& # 64; O & Uuml;	a símbol (@)
& # 38; O & amp;	Símbol Ampersand (&)
& # 8226; O & ouml;	Bala petita
¹Ignoreu l’espai abans del punt i coma mentre escriviu un caràcter HTML.

Creeu un lloc web per a l'experiència pràctica

Un cop ho hàgiu entès els conceptes bàsics del codi HTML i tenir un coneixement pràctic de CSS i JavaScript, intenteu construir la vostra pàgina web . A més, assegureu-vos de desar el full de trucs de propietats CSS3 i Full de trucs de JavaScript per a ús futur!

---

---

Compartir Compartir Tweet Correu electrònic Com accedir al nivell de bombolla integrat de Google a Android

Si mai heu necessitat assegurar-vos que hi hagi alguna cosa al mateix nivell, podeu obtenir un nivell de bombolla al telèfon en qüestió de segons.

com fer còpies de seguretat de les adreces d'interès de Chrome 10

Llegiu a continuació Temes relacionats

• Productivitat
• Programació
• HTML
• Full de trucs

Sobre l'autor Akshata Shanbhag(404 articles publicats)

Akshata es va formar en proves manuals, animació i disseny de UX abans de centrar-se en tecnologia i escriptura. Això va reunir dues de les seves activitats preferides: donar sentit als sistemes i simplificar l'argot. A MakeUseOf, Akshata escriu sobre com aprofitar al màxim els vostres dispositius Apple.

---

---

Més de Akshata Shanbhag

Subscriu-te al nostre butlletí

Uniu-vos al nostre butlletí per obtenir consells tècnics, ressenyes, llibres electrònics gratuïts i ofertes exclusives.

Feu clic aquí per subscriure-us