Diseño de páginas web estilo del texto
-
Upload
sebastian-de-los-angeles -
Category
Documents
-
view
376 -
download
0
description
Transcript of Diseño de páginas web estilo del texto
![Page 1: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/1.jpg)
Diseño de Páginas Webcon HTML
![Page 2: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/2.jpg)
Para aplicar un formato con Writer…
![Page 3: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/3.jpg)
…seleccionábamos el texto que nos interesaba…
![Page 4: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/4.jpg)
Un pequeño repaso…
…y le aplicábamos el formato con un click.
![Page 5: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/5.jpg)
Un pequeño repaso…Con HTML es diferente.
Debemos aplicar las etiquetas al comienzo y al final del texto que nos interesa formatear.
Bla bla bla bla bla bla
![Page 6: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/6.jpg)
Con HTML es diferente.
Debemos aplicar las etiquetas correspondientes al texto que nos interesa formatear.
Bla bla bla bla bla bla
![Page 7: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/7.jpg)
Bla <b>bla bla bla</b> bla bla
Con HTML es diferente.
Debemos aplicar las etiquetas correspondientes al texto que nos interesa formatear.
![Page 8: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/8.jpg)
Y entonces sí podremos ver el resultado en el navegador
![Page 9: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/9.jpg)
Al igual que en el procesador de textos, podemos aplicar cuatro estilos al texto:
•Normal•Negrita
•Cursiva•Subrayado
![Page 10: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/10.jpg)
Al igual que en el procesador de textos, podemos aplicar cuatro estilos al texto:
•Normal•Negrita
•Cursiva•Subrayado
“Normal” es el estilo que tiene el texto sin ningún
formato
![Page 11: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/11.jpg)
•Para aplicar estilo negrita usaremos la etiqueta <b>Se aplica de esta manera:
Hoy es <b>9 de agosto del 2012</b>Es un día muy agradable
“b” viene de “bold” que es una forma de decir “negrita”
en inglés
![Page 12: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/12.jpg)
•Para aplicar estilo negrita usaremos la etiqueta <b>Se aplica de esta manera:
Hoy es <b>9 de agosto del 2012</b>Es un día muy agradable
![Page 13: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/13.jpg)
El resultado es este, al ver el archivo en el navegador:
![Page 14: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/14.jpg)
El resultado es este, al ver el archivo en el navegador:
Nota cómo sólo el texto entre las etiquetas <b> y </b> fue
formateado
![Page 15: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/15.jpg)
•Para aplicar estilo cursiva usaremos la etiqueta <i>Se aplica de esta manera:
Hoy es <i>9 de agosto del 2012</i>Es un día muy agradable
![Page 16: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/16.jpg)
•Para aplicar estilo cursiva usaremos la etiqueta <i>Se aplica de esta manera:
Hoy es <i>9 de agosto del 2012</i>Es un día muy agradable
“i” viene de “italics” que es una forma de decir “cursiva”
en inglés
![Page 17: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/17.jpg)
El resultado es este, al ver el archivo en el navegador:
![Page 18: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/18.jpg)
•Para aplicar estilo subrayado usaremos la etiqueta <u>Se aplica de esta manera:
Hoy es <u>9 de agosto del 2012</u>Es un día muy agradable
![Page 19: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/19.jpg)
•Para aplicar estilo subrayado usaremos la etiqueta <u>Se aplica de esta manera:
Hoy es <u>9 de agosto del 2012</u>Es un día muy agradable
“u” viene de “underlined” que significa “subrayado” en
inglés
![Page 20: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/20.jpg)
El resultado es este, al ver el archivo en el navegador:
![Page 21: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/21.jpg)
•Al igual que en el procesador de textos, podemos combinar los estilos, agrupando las etiquetas.
Hoy es <b><i><u>9 de agosto del 2012</u></i></b>Es un día muy agradable
![Page 22: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/22.jpg)
•Al igual que en el procesador de textos, podemos combinar los estilos, agrupando las etiquetas.
Hoy es <b><i><u>9 de agosto del 2012</u></i></b>Es un día muy agradable
Cerrar las etiquetas en orden evita errores.
Lo que se abrió por último se cierra primero y asi sucesivamente
![Page 23: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/23.jpg)
El resultado es este, al ver el archivo en el navegador:
![Page 24: Diseño de páginas web estilo del texto](https://reader035.fdocument.pub/reader035/viewer/2022062216/558fe4e11a28ab571a8b46d9/html5/thumbnails/24.jpg)
Taller de Informática – 2º año 2012
Liceo Nº4 Melo
Docente: Luis Sebastián de los Angeles