LENGUAJES DE MARCAS Y SISTEMAS DE MANEJO DE

LENGUAJES DE MARCAS Y SISTEMAS DE MANEJO DE

LENGUAJES DE MARCAS Y SISTEMAS DE MANEJO DE INFORMACIÓN
TEMA 3. (X)HTML. CSS
RELACIÓN DE PROBLEMAS II
1. Confeccionar una página HTML que incorpore una hoja de estilo desde un archivo
externo. Definir reglas de estilos para las marcas body, h1 y p.
2. Definir la clase:
.resaltado{
color:#000000;
background­color:#ffff00;
font­style:italic;
}
Aplicar esta regla a las marcas h1 y span, y probar el resultado.
3. Definir en la hoja de estilo estas dos clases:
.subrayado {
color:#00aa00;
text­decoration:underline;
}
.tachado {
color:#00aa00;
text­decoration:line­through;
}
Luego, en la página xhtml, definir un título con nivel h1 (subrayar todo el título).
Luego un párrafo que tenga algunas palabras subrayadas y otras tachadas (utilizar
la marca span para asignar estilos a una palabra).
4. Definir estas dos reglas en la hoja de estilo externa. Luego crear una página HTML
que contenga 3 preguntas y 3 respuestas. A cada pregunta y respuesta estará
situada en un párrafo distinto. Asignar los estilos .pregunta y .respueta.
.pregunta {
font­family:verdana;
font­size:14px;
font­style:italic;
color:#0000aa;
}
.respuesta {
font­family:verdana;
font­size:12px;
font­style:normal;
text­align:justify;
color:#555555;
}
5. Crear un estilo por medio de un atributo id, luego crear una página con un bloque
div, definir la propiedad id con el nombre del estilo creado.
6. Definir tres estilos de tipo id (cabecera, cuerpo y pie), luego definir en el archivo
XHTML tres areas (div) inicializando el atributo id con los nombres de estilo
creados.
7. Definir dos párrafos que representen una pregunta y una respuesta. Inicializar
estilos para el borde.
8. Inicializar las marcas h1,h2 y h3 con bordes de 2 pixels, color azul y diferentes
estilos para cada una. Crear una página XHTML que los utilice.
9. Crear una clase .titulosecundario que inicialice el borde superior e inferior con
ancho de 2 pixels y los bordes laterales con cero pixels. A tu elección queda el
estilo y color.
10. Mostrar con la marca pre de XHTML un pequeño programa de Java. Hacer que el
mismo aparezca en un rectangulo amarillo, con borde y una separación entre el
borde y el contendio de 20 pixels.
11. Definir una clase titulo que fije los padding de izquierda y derecha con 20 pixeles y
el superior e inferior en 10. Escribir un texto dentro de la marca h1.
12. Disponer títulos (cabeceras) de primer y segundo nivel con un margen de 5 pixeles.
13. Probar todos los valores posibles que puede tomar la propiedad list-style-type.
14. Confeccionar una lista con los nombres de países que jugaron el mundial de
Suráfrica 2010 (mostrar sólo los cuatro primeros puestos, junto con la posición que
obtuvieron).
15. La imagen puede repetirse en x y en y hasta llenar la página por completo. Ya que
por defecto background-repeat está inicializada con el valor repeat, probar el estilo
primero con:
body {
background­image:url(../fondo.jpg);
background­repeat:repeat­x;
}
Luego con:
body {
background­image:url(../fondo.jpg);
background­repeat:repeat­y;
}
Y por último:
body {
background­image:url(../fondo.jpg);
background­repeat:no­repeat;
}
16. Usar la imagen fondo.jpg como fondo de la página, luego inicializar y probar la
propiedad background-attachment con los dos valores posibles (scroll/fixed).