El Projecte | Sobre nosaltres | Contribuir | Donacions | Llicència

HOME

Introducció

En aquest tema, aprendrem com utilitzar les etiquetes d'encapçalament i paràgraf en HTML per estructurar el text de les nostres pàgines web. Els encapçalaments són importants per organitzar el contingut de manera jeràrquica, mentre que els paràgrafs ens permeten dividir el text en blocs llegibles.

Encapçalaments

Què són els encapçalaments?

Els encapçalaments en HTML es defineixen amb les etiquetes <h1> a <h6>. Aquests encapçalaments representen diferents nivells d'importància, sent <h1> el més important i <h6> el menys important.

Estructura dels encapçalaments

<h1>Aquest és un encapçalament de nivell 1</h1>
<h2>Aquest és un encapçalament de nivell 2</h2>
<h3>Aquest és un encapçalament de nivell 3</h3>
<h4>Aquest és un encapçalament de nivell 4</h4>
<h5>Aquest és un encapçalament de nivell 5</h5>
<h6>Aquest és un encapçalament de nivell 6</h6>

Exemple pràctic

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <title>Exemple d'Encapçalaments</title>
</head>
<body>
    <h1>Benvingut al meu lloc web</h1>
    <h2>Sobre nosaltres</h2>
    <h3>La nostra història</h3>
    <h4>Els nostres inicis</h4>
    <h5>Els primers passos</h5>
    <h6>Detalls addicionals</h6>
</body>
</html>

Consells

Utilitza els encapçalaments de manera jeràrquica per mantenir una estructura lògica.
No saltis nivells d'encapçalament (per exemple, no passis de <h1> a <h3> directament).

Paràgrafs

Què són els paràgrafs?

Els paràgrafs en HTML es defineixen amb l'etiqueta <p>. Aquesta etiqueta s'utilitza per crear blocs de text separats.

Estructura dels paràgrafs

<p>Aquest és un paràgraf de text.</p>
<p>Aquest és un altre paràgraf de text.</p>

Exemple pràctic

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <title>Exemple de Paràgrafs</title>
</head>
<body>
    <h1>Benvingut al meu lloc web</h1>
    <p>Aquest és el primer paràgraf del meu lloc web. Aquí pots trobar informació sobre nosaltres.</p>
    <p>Aquest és el segon paràgraf. Continuem explicant més detalls sobre els nostres serveis.</p>
</body>
</html>

Consells

Utilitza paràgrafs per dividir el text en blocs llegibles.
Evita paràgrafs massa llargs per no sobrecarregar el lector.

Exercicis pràctics

Exercici 1: Crear encapçalaments

Crea un document HTML amb els següents encapçalaments:

Un encapçalament de nivell 1 amb el text "La meva pàgina web".
Un encapçalament de nivell 2 amb el text "Introducció".
Un encapçalament de nivell 3 amb el text "Objectius".
Un encapçalament de nivell 4 amb el text "Metodologia".
Un encapçalament de nivell 5 amb el text "Resultats".
Un encapçalament de nivell 6 amb el text "Conclusió".

Solució

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <title>Exercici d'Encapçalaments</title>
</head>
<body>
    <h1>La meva pàgina web</h1>
    <h2>Introducció</h2>
    <h3>Objectius</h3>
    <h4>Metodologia</h4>
    <h5>Resultats</h5>
    <h6>Conclusió</h6>
</body>
</html>

Exercici 2: Crear paràgrafs

Crea un document HTML amb els següents paràgrafs:

Un paràgraf amb el text "Aquest és el primer paràgraf de la meva pàgina web."
Un paràgraf amb el text "Aquest és el segon paràgraf, on explico més detalls sobre el contingut."

Solució

<!DOCTYPE html>
<html lang="ca">
<head>
    <meta charset="UTF-8">
    <title>Exercici de Paràgrafs</title>
</head>
<body>
    <p>Aquest és el primer paràgraf de la meva pàgina web.</p>
    <p>Aquest és el segon paràgraf, on explico més detalls sobre el contingut.</p>
</body>
</html>

Conclusió

En aquest tema, hem après com utilitzar les etiquetes d'encapçalament i paràgraf en HTML per estructurar el text de les nostres pàgines web. Els encapçalaments ens ajuden a organitzar el contingut de manera jeràrquica, mentre que els paràgrafs ens permeten dividir el text en blocs llegibles. En el proper tema, explorarem les etiquetes de formatació de text per donar estil al nostre contingut.

Encapçalaments i paràgrafs

Introducció