Entitats HTML i CSS

Etiquetes HTML

<p> </p> : és per definir i acotar paràgrafs. Automàticament crea un espai abans i després d'aquesta etiqueta.

<img> : incrusta una imatge en una pàgina html. Aquesta etiqueta va conjuntament amb les etiquetes <scr> i <alt>. Exemple: <img src="imatges/pere-sadurni01.jpg" alt="foto Pere Sadurní">.

<h1> </h1>... <h6> </h6> : aquestes etiquetes són per definir el tamany del text, <h1> és el tamany més gran, quan el número de l'etiqueta és més gran el tamany del text és més petit.

<ol> </ol> : aquesta etiqueta és per crear una llista ordenada. Aquesta llista por ser numèrica o alfabètica.

<ul> </ul> : aquesta etiqueta és per crear llistes sense ordenar.

<li> </li> : aquesta etiqueta defineix un element d'una llista. Es pot fer servir tan en una llista ordenada com sense ordenar.

<a ...> </a> : aquesta etiqueta defineix un anclatge. Aquest ancoratge pot ser du dos tipus, per crear un enllaç cap a un altre document, fent servir l'atribut "href" i per crear un enllaç din fent servir el matrix nom de l'atribut.

<span> </span> : aquesta etiqueta l'he fet servir per canviar estil de paraules com negreta o cursiva.

<div style> </div> : aquesta etiqueta l'he fet servir per donar parges als texts dins de la pàgina "maquetació.htm"

Etiquetes CSS

html, body, div : en la primera línia del full d'estil CSS, s'indica com es vol decorar o estilitzar els tres elements bàsics i com els navegadors ho interpretaran. En aquest cas tan el document (html), el cos (body) i les divisions (div) són a "0", per tan no tenen marges, ni espais ni voreres.

container { width:950px; margin: auto; height:100%; } : és el contenidor que conté els apartats "menu" i "content", té una amplada (width) de 950 px, i els marges (margin), en aquest cas, s'ajusten automàticament.

menu {float:left; margin-right:5px; width:190px; background-color:#CCFFFF; padding: 20px 0px 20px 5px; font-family:Arial, Helvetica, sans-serif; font-size:18px; height:150px; }: és l'apartat que conté el menú de navegació, on s'indica, els marges, amplada, color de fons, separació del comtingut respectes els marges (padding), tipus i tamany de lletra i l'alçada màxima d'aquest contenidor.

content {float:right; width:750px; background-color:#ccffcc; height:100%;}: és l'apartat o contenidor central de l'html on es posa tots els cotinguts i informació del document. En aquest cas té una amplada de 750px i el "float" indica que els elments d'aquest contenidor floten.

<h1> - <h4> {...}: indiquen els tamanys de text emprats com a capçaleres, títols i subtítols de les pàgines d'aquest document html, des d'aquest connector, es controla el tipus i tamany de text.

#menu a:link, a: visited, a:hover: indiquen el funcionament dels enllaços específics només del menú, cada selector indica un color diferent (link = blau, visited = gris i hover = vermell).

#content a:link i a:visited { text-decoration: none;} : indiquen que a la resta d'enllaços no mostrin la barra inferior (per defecte)