Extras.docx

Extras: Ejemplo de lista de descripción de términos en HTML  Mostrar un glosario de siglas:

http://www.abrirllave.com/html/ejemplo-lista-de-descripcion-de-terminos.php

Extras: Ejemplo de tabla básica en HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-tabla-basica.php

Extra: Ejemplo de tabla con bordes en HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-tabla-con-bordes.php

Extra: Ejemplo de tabla con celdas separadas en HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-tabla-con-celdas-separadas.php

Extras: Ejemplo de tabla con borde junto en HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-tabla-con-borde-junto.php

Extra: Ejemplo de tabla con relleno de celdas en HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-tabla-con-relleno-de-celdas.php

Extra: Ejemplo de anchura en una tabla HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-uso-de-la-propiedad-css-width-en-una-tabla.php

Extra: Ejemplo de uso de este atributo en una tabla en HTML  Visualización en pantalla

http://www.abrirllave.com/html/ejemplo-uso-de-rowspan.php

Extra: Selector Universal  Seleccionar universalmente todos los bordes del documento con 1px color plata, y colocar a todo el documento letra de color azul. Ver documento…

Extra: Ejemplo de una división en HTML (style)  Ejemplo explicado en el apartado "Divisiones" del tutorial de HTML.

Visualización en pantalla

Extra: Ejemplo de uso del elemento "div" y de este atributo en HTML (class)  Ejemplo explicado en el apartado "Divisiones" del tutorial de HTML.

Visualización en pantalla

Extra: Ejemplo de uso del elemento "div" y del atributo id en HTML  Utilizar el atributo “id” teniendo las siguientes consideraciones:       

Establecer universalmente 0 tanto para márgenes y espacio del borde al contenido. El color de enlaces es #0f0 y su grandor es de 16 pixeles. El fondo de la página es #eee, y se utiliza para todo el documento el tipo de letra verdana. El titulo tiene un color de #c0c con un grandor de 24 pixeles El grandor de la letra del párrafo es de 16 pixeles. La lista en el menú no lleva puntos. Crear un contenedor llamado “cuerpo” que encierra a los contenedores #menu y #contenido (utiliza flex box).

Otros elementos:

cabecera Color #ff9 Fondo #000 Espacio entre el borde y contenido 10 pixeles

contenedor Centrar contenedor horizontalmente Ancho 800 pixeles contenido fondo #ddd Alto 500 pixeles Espacio entre el borde y el contenido 10 pixeles Ancho 560 pixeles

menu Fondo #999 Altura 480pixeles Espacio entre el borde y el contenido 20 pixeles Ancho 180 pixeles #pie { Fondo #bbb Color #900 Espacio entre el borde y el contenido 10 pixeles Texto centrado

Visualización en pantalla

------------------------------------------------------------------------------

Extra: Ejemplo de márgenes, bordes y rellenos  Consideraciones: Crear un contenedor llamado contenedor1 con lo siguiente: Margen superior de:10 pixeles Margen derecho:20 pixeles Margen inferior:30 pixeles Margen izquierdo:40 pixeles Borde superior:10px color negro solido. Borde derecho:20px color amarillo solido. Borde inferior:30px color verde solido. Borde izquierdo:40px color naranja solido. Relleno superior:10 pixeles. Relleno derecho:20 pixeles. Relleno inferior:30 pixeles Relleno izquierdo:40px; Crear un contenedor llamado contenedor2 con lo siguiente:

Margen superior:.62em. Margen derecho:1.25em. Margen inferior:1.87em. Margen izquierdo:2.5em. Borde superior:.62em color negro solido. Borde derecho:1.25em color amarillo solido. Borde inferior:1.87em color verde solido. Borde izquierdo:2.5em color naranja solido. Relleno superior:.62em. Relleno derecho:1.25em; Relleno inferior:1.87em; Relleno izquierdo:2.5em; Crear un contenedor llamado contenedor3 con lo siguiente: Margen en auto. Borde superior:10 pixeles color negro solido. Borde derecho:20 pixeles color amarillo solido. Borde inferior:30 pixeles color verde solido. Borde izquierdo:40 pixeles color naranja solido. Relleno superior:10 pixeles. Relleno derecho:20 pixeles. Relleno inferior:30 pixeles. Relleno izquierdo:40 pixeles. Crear un contenedor llamado contenedor4 con lo siguiente: Margen superior:10% Margen derecho:20% Margen inferior:30% Margen izquierdo:40% Borde superior:10 pixeles color negro solido Borde derecho:20pixeles color Amarillo solido Borde inferior:30 pixeles color verde solido Borde izquierdo:40 pixeles color naranja solido Relleno superior:10% Relleno derecho:20% Relleno inferior:30% Relleno izquierdo:5% } Ejercicio con las siguientes consideraciones; la letra de todo el documento tiene un grandor 18 pixeles.

Ver: file:///C:/Users/USER.DESKTOP2KO3OCO/Desktop/Curso%20Desarrollo%20Web/Ejercicios%20HTML/Complemento%20extra/ma rgenes-bordes-y-rellenos.html

Uso propiedad max-width  Crear los siguientes contenedores, usar la propiedad max-width. En la segunda imagen utilizar width:auto y height:auto. file:///C:/Users/USER.DESKTOP2KO3OCO/Desktop/Curso%20Desarrollo%20Web/Ejercicios%20HTML/Complemento%20extra/uso %20propiedad%20max-width%20y%20max-height/max-width.html

Uso propiedad max-height  Condiciones: • Contenedor uno, tamaño de alto 300 pixeles • Contenedor dos, tamaño de alto 550 pixeles • Contenedor tres, tamaño de alto 550 pixeles file:///C:/Users/USER.DESKTOP2KO3OCO/Desktop/Curso%20Desarrollo%20Web/Ejercicios%20HTML/Complemento%20extra/uso %20propiedad%20max-width%20y%20max-height/max-height.html

Recortar contenido – Contenido con barras laterales  Crear el archivo ocultar-barraslaterales.html, Crear dos contenedores con las siguientes propiedades; borde 1 pixel y color negro, color de fondo amarillo, espacio entre el contenido y el borde 5 pixeles, anchura 50%, altura 100 pixeles, colocar para el segundo contenedor un margen inferir de 5px. En el primer contenedor ocultar el contenido, en el segundo contenedor colocarle al contenido barras laterales y un margen superior de 5 pixeles. Utilizar el siguiente contenido para los dos contenedores:

Hojas de estilo en cascada (o CSS, siglas en inglés de Cascading Stylesheets) es un lenguaje de diseño gráfico para definir y crear la presentación de un documento estructurado escrito en un lenguaje de marcado.2? Es muy usado para establecer el diseño visual de los documentos web, e

interfaces de usuario escritas en HTML o XHTML; el lenguaje puede ser aplicado a cualquier documento XML, incluyendo XHTML, SVG, XUL, RSS, etcétera. También permite aplicar estilos no visuales, como las hojas de estilo auditivas. Junto con HTML y JavaScript, CSS es una tecnología usada por muchos sitios web para crear páginas visualmente atractivas, interfaces de usuario para aplicaciones web, y GUIs para muchas aplicaciones móviles (como Firefox OS).3?

Extra: Crear formulario 1, 2, 3  Crear formularios 1, 2, 3. Ver la página web donde están los formularios: Ver documento…

Colocar el tipo de letra Dancing Script en un documento HTML  Recordatorio HTML 26: Centrar Elemento HTML (Ejercicio eliminado)

Títulos y encabezados  Ver documento…

Extra: Documento Base en HTML  Crear un documento base en HTML, con un comentario

Extra: Unidad de medida em  Crear dos contenedores con las siguientes consideraciones: Contenedor1: 

Borde de 1 em de color negro

Contenedor2:  

Letra de 24 pixeles Borde de 1 em de color azul

Extra: Utilizar el atribute title Colocar este atributo a un título h1.