ejercicio2 maquete-utilizando-css-externo

9
“Año de la diversificación productiva y del fortalecimiento de la educación” INSTITUTO DE EDUCACIÓN SUPERIOR TECNOLÓGICO PRIVADO “TECNOTRONIC” COMPUTACIÓN E INFORMÁTICA UNIDAD DIDACTICA : DISEÑO WEB DOCENTE : HANCCO QUISPE, Elar E. ESTUDIANTE : COILA FLORES, Yurema Lucero. CICLO ACADÉMICO : V SEMESTRE : 2015 III

Upload: ru-vilca

Post on 14-Aug-2015

76 views

Category:

Documents


2 download

TRANSCRIPT

Page 1: Ejercicio2 maquete-utilizando-css-externo

“Año de la diversificación productiva y del fortalecimiento de la educación”

INSTITUTO DE EDUCACIÓN SUPERIOR TECNOLÓGICO PRIVADO

“TECNOTRONIC”

COMPUTACIÓN E INFORMÁTICA

UNIDAD DIDACTICA : DISEÑO WEB

DOCENTE : HANCCO QUISPE, Elar E.

ESTUDIANTE : COILA FLORES, Yurema Lucero.

CICLO ACADÉMICO : V

SEMESTRE : 2015 III

Juliaca - Puno – Perú.

Page 2: Ejercicio2 maquete-utilizando-css-externo

2015

Page 3: Ejercicio2 maquete-utilizando-css-externo

VISIÓN

En el 2018, El IESTP TECNOTRONIC es un Modelo Empresarial

Educativo de Excelencia Académica que lidera la

Educación Superior Tecnológica de la región sur del país.

MISIÓN

Formar profesionales competitivos en un ambiente de

Emprendimiento, Innovación, Eficiencia y Valores.

Page 4: Ejercicio2 maquete-utilizando-css-externo

Ejercicio 2: Maquete utilizando CSS externo.

Primero lo tenemos abierto el programa dreamweavern para así poder trabajar,

los pasos son los siguientes.

Paso N°1: Trabajaremos en el archivo CSS.

Para esto es los siguientes códigos que nos servirán para poder hacerlo el

ejercicio N°2

Paso N°2: codificamos los siguientes códigos para el cuerpo asignado que es

lo siguiente.

#cuerpo{

width:900px;

background:#00C;

margin:auto;

}

Page 5: Ejercicio2 maquete-utilizando-css-externo

Paso N°3: codificamos los siguientes códigos para la cabecera asignado que

es lo siguiente.

#cabecera{

width:895px;

height:200px;

background-color:#09F;

border:solid #F00;

}

Paso N°4: codificamos los siguientes códigos para la capa 2 asignado que es

lo siguiente.

#capa2{

width:200px;

height:300px;

background:#F60;

border:solid #F00;

}

Paso N°5: codificamos los siguientes códigos para la capa 3 asignado que es

lo siguiente.

#capa3{

width:200px;

height:300px;

background:#F33;

border:solid #F00;

}

Page 6: Ejercicio2 maquete-utilizando-css-externo

Paso N°6: codificamos los siguientes códigos para la capa 4 asignado que es

lo siguiente.

#capa4{

left:430px;

top:213px;

position:absolute;

width:690px;

height:607px;

background:#F63;

border:solid #F00;

}

Paso N°7: codificamos los siguientes códigos para la capa 5 asignado que es

lo siguiente.

#capa5{

width:895px;

height:70px;

background-color:#F06;

border:solid #F00;

}

Page 7: Ejercicio2 maquete-utilizando-css-externo

Paso N°8: Trabajaremos en el archivo HTML.

Para esto es los siguientes códigos que nos servirán para poder hacerlo el

ejercicio N°2

Paso N°9: codificamos los siguientes códigos para la práctica 2 (HTML)

asignado que es lo siguiente.

Page 8: Ejercicio2 maquete-utilizando-css-externo

Paso N° 10: Es el resultado ejecutado en el navegador (ejercicio N°2)