Scribd
Cargar
125 vistas7 páginas

Activdad Enlaces HTML

El documento describe una evaluación para analizar los requisitos de un cliente y construir un sistema de información. Incluye actividades para comprobar conocimientos sobre etiquetado HTML5 y CSS3, aplicar estas etiquetas para crear páginas web, y completar pruebas sobre HTML5 y CSS3 en Educaplay.

Cargado por

Franco Reina Argoty
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 DOCX, PDF, TXT o lee en línea desde Scribd
125 vistas7 páginas

Activdad Enlaces HTML

El documento describe una evaluación para analizar los requisitos de un cliente y construir un sistema de información. Incluye actividades para comprobar conocimientos sobre etiquetado HTML5 y CSS3, aplicar estas etiquetas para crear páginas web, y completar pruebas sobre HTML5 y CSS3 en Educaplay.

Cargado por

Franco Reina Argoty
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 DOCX, PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 7

SENA REGIONAL CAUCA Evaluación

CENTRO DE TELEINFORMATICA Y PRODUCCION INDUSTRIAL Proyecto


ANALIZAR LOS REQUISITOS DEL CLIENTE PARA CONSTRUIR
Total
EL SISTEMA DE INFORMACION

ACTIVIDAD DE CONOCIMIENTO

2. Aplicación y uso de las etiquetas HTML5 – CSS3


1. Comprueba tus conocimientos en cuanto al manejo del etiquetado Html5 – CSS3
Responde las siguientes preguntas (las preguntas que incluyen desarrollo realizarlo en sublime para
comprobar su funcionamiento luego depositar (pegar) el código dentro de actividad.

a. ¿Por qué es conveniente incluir la declaración de DOCTYPE en la página HTML?


La Declaración del tipo de documento o Doctype es una instrucción especial que va al inicio
de nuestro documento HTML y que permite al navegador entender qué versión de HTML
estamos utilizando. Esta información determinará la manera en la que el navegador
procesará el documento, un DOCTYPE distinto podría implicar hasta una visualización
diferente del sitio web dentro del mismo navegador.

b. Construya una tabla con 4 columnas y 3 filas utilizando las etiquetas de tabla

c. ¿Para qué sirve el atributo 'class'?


El atributo class identifica el elemento table (span, en el caso del código scalar) como una de
una clase de elementos en el modelo de objeto de documento HTML.

<table class="table-class">

d. ¿Cuál es la diferencia al utilizar un etiqueta div y una etiqueta span?


La diferencia entre el div y span es que div se emplea para agrupar elementos html en un
bloque en cambio span sirve para agrupar dentro de una línea.
e. Si incluimos una etiqueta de este tipo en nuestra página HTML, ¿qué queremos que haga el
navegador?: <img src="../icono.gif" />
Que incluya la imagen 'icono.gif' que se encuentra en la misma carpeta donde está nuestra página
HTML.

f. Construya una lista ordenada de 5 lenguajes de programación utilizando las etiquetas

g. ¿Cómo se incluye un comentario nuestro en una página HTML para que no se interprete por el
navegador?
<!—comentario no visible --!>
h. Realice un ejemplo para los tipo de selector CSS: Selector de tipo, selector ID, selector de clase
i. Inserte un video, un audio utilizando archivos locales y luego utilizando el url

j. Se puede argumentar que las etiquetas section y article realizan la misma función de estructura
dentro de una página web.
La etiqueta section define las secciones de un documento, como capítulos, encabezados,
pies de página o cualquier otra sección del documento.

La etiqueta del article especifica contenido independiente y autónomo.


Un artículo debe tener sentido por sí mismo y debería ser posible Distribuirlo
independientemente del resto del sitio.
2. Aplicando las etiquetas HTML 5, elementos para texto, tipos de enlaces, CSS
A partir del siguiente documento construye la página principal home page (index.html)

<!doctype html>

<html lang="es">

<head>

<meta charset="utf-8" />

<title>Cursos gratis</title>

<link rel="stylesheet" type="text/css" href="" />

</head>

<body>

<h1>Curso de diseño Web</h1>

<p>La primera web en español sobre cursos de informática gratis on-line</p>

<h2>Cursos disponibles 2020</h2>

<p>Diseño web HTML5 y CSS3</p>

<h2>Diseño web con Adobe </h2>

<p>Diseño web con breakers </p>

<hr>

<p><b>Construcción de prototipos</b></p>

</body>

</html>

a. Ubicar dentro del documento al menos 4 etiquetas estructurales de acuerdo a HTML5(nav – article,
etc), ubicar dentro otras etiquetas de encabezado, párrafo, énfasis de texto (rellenar utilizando
párrafos y Lorem ipsum)
b. Utilizando los estilos CSS aplicar un color utilizando la notación hexadecimal a las etiquetas de
encabezado h1, h2, utilizando la asignación de colores por keyword

c. Crear una página web nueva (con la temática de JavaScript guardarla con el nombre
javascript.html)con los elementos estructurales básicos del HTML que tenga al menos 3
encabezados (h1,h2.. acerca de JavaScript), texto (rellenar utilizando párrafos y Lorem ipsum)
d. Crear los enlaces respectivos de javascript.html a index.html y viceversa, crear enlaces a una
página web externa, dentro de la misma página, a un correo y a un documento
e. Insertar una lista desordenada de 4 frameworks que se hayan realizado con JavaScript, ubicarle
haciendo uso de color a través de keywords el color gray a la lista
f. Utilizando los selectores CSS de tipo asignar color, fuente, tamaño, interlineado a los párrafos de
las páginas web
g. Insertar en la página index.html imágenes(2), video(1), audio(1)
h. Utilizando el elemento background ubicar un color a uno(s) párrafos de la pagina

3. Utilizando los siguientes enlaces de codepen.io realizar los ejercicios propuestos tomar un pantallazo
de la ejecución de la actividad final.

a. https://code pen.io/devcodela/pen/mymPrb utilizando el selector universal crear una directiva para


las etiquetas h1,p utilizando el color #2D402F para h1 y el color #5B805E para párrafo

b. https://codepen.io/devcodela/pen/vEmGWY cambiar el color a las pseudoclases link y visited


utilizando la notación de color RGB
c. https://codepen.io/devcodela/pen/zxwqZL Crear un selector por ID que involucre las propiedades
para párrafo #354A78, Times New Roman, 16

d. https://codepen.io/devcodela/pen/RNgPRO Cambiar las propiedades pulgadas a: height: 30px;


font-family: Arial; font-size: 20px; overflow: visible;
Centímetros height: 20px; font-family: Comics San MS; font-size: 16px; overflow: visible;
4. Ingresa a la siguiente dirección: https://es.educaplay.com/recursos-educativos/2184160-
examen_html5_y_css3.html Resuelve el Test planteado en educaplay; recuerda al final del test hay
una retroalimentación del mismo. Compartir pantallazo de tu primer Test.

También podría gustarte