Introducció Imatges i enllaços Inserció d'imatges Alineació de la imatge: Propiedades | Alinear Propietats de la imatge: visualització Definició d'enllaços Enllaços en pàgines amb marcs Taules Taules Creació d'una taula Modificar l'aspecte de la taula Modificar l'aspecte de columnes, files i cel·les Vincles especials Vincles amb ancoratges Inserir un punt d'ancoratge amb nom Definir un vincle que apunti a un ancoratge Enllaç a una adreça de correu electrònic Enllaços a fitxers que no són pàgines web | UD 1: Disseny web amb Macromedia Dreamweaver Taules Les taules són un conjunt de files i columnes que donen com a resultat una graella de caselles on hi pot haver lletres, números, imatges... De fet, les taules d'una pàgina HTML són semblants a les d'un processador de textos i serveixen per encolumnar i estructurar el text i les imatges amb més precisió. Creació d'una taula Objectiu: creació d'una taula resum de les dades estadístiques de distribució de la població segons sexe i edat a la comarca. Dades: prenem-les de la web del Idescat Modificar l'aspecte de la taula Taula per introduir un nom per la taula. Filas i Cols. , per modificar el nombre de cadascuna. An i Al , per especificar l'amplada i l'alçada amb percentatge o amb píxels. Escriviu 350 al camp An i activeu l'opció píxels . Observeu com la taula ha canviat de mida i ja no està ajustada a l'amplada de la finestra del programa. Si especifiqueu l'amplada de la taula en píxels eviteu que aquesta canviï de mida quan redimensioneu la finestra dels navegadors. Alinear , per especificar com cal arrenglerar la taula amb altres elements del mateix paràgraf (text, imatges...) Els botons Borrar alto de fila i Borrar ancho de columna per esborrar tots els valors d'alçada de fila i amplada de columna de la taula. Els botons Convertir ancho de tabla a píxeles per convertir l'amplada de la taula expressada en percentatge a píxels i Convertir ancho de tabla a porcentaje per convertir l'amplada de la taula expressada en píxels a un percentatge de la finestra del navegadors. Rell.celda , per especificar el nombre de píxels que hi ha entre el contingut de la cel·la i el límit d'aquesta (encoixinament). Augmenteu-lo al valor 2 . Esp.celda per especificar el nombre de píxels que hi ha entre les cel·les de la taula. Modifiqueu el valor 1 substituint-lo per 0 . Borde per especificar l'amplada del contorn de la taula en píxels. recordeu que la majoria dels navegadors mostren el contorn com a una línia tridimensional quan el seu valor és superior a 0. Col. borde per seleccionar el color del contorn per a tota la taula. Feu clic a sobre del camp i seleccioneu el valor #003399 . Col. Fondo per seleccionar el color de fons de la taula. Feu clic a sobre del camp i seleccioneu el valor #003399 . Modificar l'aspecte de columnes, files i cel·les Canvieu el tipus de lletra de tota la taula. Situeu el punter del ratolí a la cel·la amb el text Edats i seleccioneu totes les cel·les de la taula arrosegant el cursor fins el final de la taula. Activeu la llista desplegable del camp corresponent a la font i seleccioneu Arial, Helvética... , al camp Tam. seleccioneu 2 . Visualitzeu els canvis. Poseu en negreta tot el text de la primera fila. Seleccioneu el seu contingut i feu clic al botó Negreta de la finestra Propiedades . Repetiu l'operació amb la columna de l'esquerra. Alineeu al centre tots els elements de la taula. Situeu el punter del ratolí a la cel·la amb el text Edats i seleccioneu totes les cel·les de la taula arrossegant el cursor fins el final de la taula. Feu clic al botó Alinear al centro . Per unificar les cel·les, arrodoniu tots els valors a dos decimals. El següent pas serà ajustar la mida de les columnes. Situeu el punter del ratolí a la primera cel·la de la columna de la dreta. Seleccioneu tota la columna. A la finestra Propiedades escriviu 175 al camp An . Seguint el mateix procediment canvieu l'amplada de la segona columna a 75 píxels . Repetiu el procés per a la tercera columna. Fixeu-vos que la suma de les tres columnes (175+75+75) és igual a l'amplada total de la taula (325). Si els valors no són coherents, en el moment de la visualització els navegadors ajustaran les mides. Modifiqueu el color de fons de les cel·les. Situeu el cursor a la cel·la Edats i seleccioneu totes les cel·les de la taula. A la finestra Propiedades opció Fnd. situada a la part inferior (la que fa referència a l'element seleccionat, no al text) seleccioneu el color de fons #FFFFFF . Canvieu a #FF9900 el color de fons de les cel·les de la primera fila. Canvieu també el color del text d'aquesta fila. Seleccioneu el text i teclegeu al camp Color de texto de la finestra Propiedades el valor #FFFFFF . Deseu la pàgina poblacio.htm i comproveu com es visualitza Després de la taula afegiu una referència a la web d'on s'ha obtingut la informació: Web de l'Institut d'Estadística de Catalunya Per acabar es tracta d'enllaçar la pàgina garrotxa.htm amb la que acabeu de fer poblacio.htm . | Vincles a : iesbaixcamp.org iesbaixcamp.org/moodle iesbaixcamp.org/blogs/ www.xtec.net www.gencat.es
Crèdit 6 - Disseny i realització de serveis de presentació en entorns gràfics