Scribd
Cargar
4 vistas11 páginas

Crear un sitio web con HTML y CSS

El documento describe los pasos para crear un sitio web utilizando HTML y CSS. Se detallan las etiquetas HTML necesarias para estructurar la página, incluyendo <header>, <nav>, <section>, <aside> y <footer>, así como la vinculación de una hoja de estilos CSS. También se mencionan aspectos de diseño como la organización del menú y el estilo del contenido.

Cargado por

haroldbenavides2008
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
4 vistas11 páginas

Crear un sitio web con HTML y CSS

El documento describe los pasos para crear un sitio web utilizando HTML y CSS. Se detallan las etiquetas HTML necesarias para estructurar la página, incluyendo <header>, <nav>, <section>, <aside> y <footer>, así como la vinculación de una hoja de estilos CSS. También se mencionan aspectos de diseño como la organización del menú y el estilo del contenido.

Cargado por

haroldbenavides2008
Derechos de autor
© All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

CSS

Vamos a crear un sitio web como este

Vamos a darle la estructura HTML y luego codificar el CSS.

1. Creamos una carpeta


2. Luego la abrimos a nuestro Visual Studi Code
3. Creamos un fichero [Link]
4. Definimos una etiqueta que contenga toda la pagina Web, para darle al ancho, el largo,
etc.

5. Ahora definimos la cabecera de la pagina, la cual no permite crear una caja que se
identifica con la referencia a la cabecera del sitio web de manera semántica las etiquetas
de html5 <header>
6. Luego vamos a definir el menú con la etiqueta <nav> la cual me permite definir una barra
de menú. Y dentro voy a definir una lista como se muestra a continuación.
7. Ahora vamos a definir la parte del contenido, para ello vamos a utiliza la etiqueta
<section> y por dentro colocamos la etiqueta <article> donde definimos una clase con el
nombre article

8. Ahora vamos a crear la barra lateral, colocamos la etiqueta <aside> para hacer una caja
semánticamente que representa una barra lateral
9. Ahora creamos el pie de pagina que seria con la etiqueta <footer>, que representa el pie
de pagina.
10. Ahora le vamos a dar forma utilizando CSS. Para ello creamos un archivo llamado
[Link] y colocamos el siguiente comando

11. Ahora vinculamos esa hoja de estilo con la siguiente etiqueta, esto lo realizamos en el
archivo [Link]

12. Vamos a cambiar la fuente del tipo de texto que tengo en la pagina web.
13. Ahora vamos a darle forma a la cabecera. Para ello seleccionamos el container y
establecemos el ancho, margen, bordes.

Establecemos las márgenes en 0

14. vamos a organizar el menú con los elemento uno al lado del otro manera horizontal,
seleccionamos la nav y los elementos que van a estar dentro de la nav, en este caso el ul y
li
5. Organizamos los elementos del contenido, definiendo una clase

Esta parte va en [Link]

Ahora vamos a colocarle un fondo de colora azul, centrado a nuestro menú.


Ahora vamos a dar un estilo al contenido y a la barra lateral

Ahora organizamos el pie de pagina


Ahora vamos a dar unas márgenes dentro y por fuera de otras, por ejemplo la barra lateral.

También podría gustarte