pagina web con maquetacion

6
PAGINA WEB CON MAQUETACION Lo primero que hacemos es colocarle la estructura que toda página debe tener, para empezar a crearla, entonces emplazamos tecleando el siguiente código. Luego si podemos ponerle las demás funciones, las cuales nos van formando nuestra página web. Para ello vamos a utilizar las siguientes funciones. DIV: agrupa una serie de elementos que van a ser cambiados por el maqueteador CSS, Una página web puede tener varios DIV. HEADER: es la cabecera MAQUETACIÓN: darle una función al código TR: filas TH O TD: forma columnas COLSPAN: une filas

Upload: hjxbfajds

Post on 24-Jul-2015

147 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: Pagina web con maquetacion

PAGINA WEB CON MAQUETACION

Lo primero que hacemos es colocarle la estructura que toda página debe tener, para empezar a crearla, entonces emplazamos tecleando el siguiente código.

Luego si podemos ponerle las demás funciones, las cuales nos van formando nuestra página web. Para ello vamos a utilizar las siguientes funciones.

DIV: agrupa una serie de elementos que van a ser cambiados por el maqueteador CSS, Una página web puede tener varios DIV.

HEADER: es la cabecera

MAQUETACIÓN: darle una función al código

TR: filas

TH O TD: forma columnas

COLSPAN: une filas

CORSPAN: une columnas o celdas

P: permite escribir texto.

CENTER: permite centrar un texto o una imagen.

Page 2: Pagina web con maquetacion

Y al colocarlas en nuestra página las anteriores funciones, y la siguiente estructura, nos dará el siguiente resultado.

Para poner un navegador en nuestra página web, utilizamos la siguiente estructura.

Y al ejecutarlo nos dará la opción de buscar e indagar acerca del tema u otra cosa.

Después de haber realizado los anteriores pasos ya podemos empezar con la maquetación, primero que todo vamos a crear una carpeta de nombre CSS puede ser en el escritorio.

Page 3: Pagina web con maquetacion

En la carpeta que creamos vamos a guardar la siguiente estructura, en donde la función FONT-FAMILY podemos darle un tipo de letra al título que en este caso el tipo de letra que utilizara será

DESTROYED.

Creamos un archivo nuevo, en el cual lo vamos a guardar como header.css, en donde maquetearemos el tipo de letra, y de esta forma se podrá realizar los estilos que queramos.

Luego le colocaremos la siguiente estructura, en donde podemos hacer los retoque o ajustes que queramos al aplicar a nuestra página web.

Y al ejecutarla nos dará el siguiente resultado.

Page 4: Pagina web con maquetacion

Luego siguiente de la estructura HEADER, vamos a colocarle el siguiente código, en donde nos permite ajustar el ancho y largo de nuestro titulo.

/*Esta es una hoja de estilo para mi pagina web*/

div#todo {

margin:0 auto;

width:959px;

border:solid 1px back;

}

Creamos un archivo nuevo, en el cual lo vamos a guardar como estilo.css.

Creando este estilo hacemos que nuestro código se relacione con nuestra hoja de estilo, utilizando

el siguiente código.

Page 5: Pagina web con maquetacion

Lo guardamos en una carpeta llamada estilo con el nombre de estilo.css.

En la hoja de CSS le damos propiedades a nuestra página en este caso tiene que aparecer centrada.

Y de esta manera es cómo podemos crear páginas web atreves de la maquetación y utilizando estructura que le dan forma y diseño.