Ir al contenido principal

Ejercicio dos usasdo HTML y CSS


 En el siguiente enlace se muestra el código no modificado que da solución a la anterior imagen.
codigo_sin_modifica

Ahora se debe aplicar los siguientes cambios al código:

  • Tienes que tener en cuenta los siguientes requisitos:
    • El texto principal:
      • El color del texto es azul: #00F.
      • El color de fondo del texto es verde claro: #CFC.
      • El tipo de letra es la secuencia: Georgia, Cambria, serif.
      • El tamaño del texto: 16px.
    • El encabezado de nivel 1:
      • El color del texto es rojo claro: #F00.
      • El tipo de letra es la secuencia: Verdana, Calibri, sans-serif.
      • El tamaño del texto: 32px.
    • El encabezado de nivel 2:
      • El color del texto es rojo claro: #A00.
      • El tipo de letra es la secuencia: Verdana, Calibri, sans-serif.
      • El tamaño del texto: 24px.
    • El color de los campos de los datos del libro es verde oscuro: #060.
    • El texto "Internet" y la "Web" cuando actúan como sustantivos:
      • El tamaño del texto: 20px.
      • Texto en negrita.
    • El texto "Hypertext Markup Language", "Cascading Style Sheets" y los acrónimos "HTML" y "CSS":
      • El color del texto es blanco: #FFF.
      • El color de fondo del texto es negro: #000.
      • Texto en cursiva.
    Consejo: puedes utilizar las etiquetas de HTML como <span>, <em> y <strong> para aplicar un estilo CSS a cualquier parte del texto.
 En el siguiente enlace se muestra el código ya modificado.
codigo_modificado2

Comentarios

Entradas más populares de este blog

Formulario usando colores

Formulario usando colores Se desea obtener la siguiente imagen: Código  en html <!DOCTYPE html> <html lang="es"> <head> <meta charset="utf-8" /> <title>Registro - iDESWEB</title> <style> body {   font-family: Arial, Helvetica, sans-serif;   width: 90%;   margin: 0 auto; } header {   text-align: center; } h1, h2 {   font-family: Georgia, serif; } h1 {   font-size: 3em; } fieldset {   margin: 1em auto; } legend {   font-size: 1.2em;   font-weight: bold;   text-transform: uppercase; } label {   font-weight: bold;   display: block; } input:focus, select:focus {   background-color: yellow; } input:hover, select:hover {   background-color: red; } #boton-crear {   font-size: 2em;   padding: 0.5em; } .inline {   display: inline; } .centrado {   text-align: center; } </style> </head...

Listas usando números romanos, círculos, cuadros y letras griegas

Listas usando números romanos, círculos, cuadros y letras griegas A partir de la página web que se te proporciona, debes escribir las reglas CSS necesarias para lograr una página web que tenga el mismo aspecto que la siguiente imagen: Código en html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Ejemplo de listas</title> <style> .lista-sin {   list-style-type: none; } .lista-circulos {   list-style-type: circle;  <!--jcon esta parte se modifica que aparezca la lista-circulos con círculos y así con los demas--> } .lista-cuadrados {    list-style-type: square; } .lista-romanos {   list-style-type: lower-roman; } .lista-griegos {   list-style-type: lower-greek; } </style> </head> <body> <p>Lista sin elemento gráfico:</p> <ul class="lista-sin"> <li>...

Ejemplo tres con HTML y CSS

  En el siguiente enlace se muestra el código no modificado que da solución a la anterior imagen. codigo_sin_modifica Ahora se debe aplicar los siguientes cambios al código, esta vez la parte de CSS se debe hacer en un archivo aparte y en el archivo principal (.html) se llama el archivo .css. Tienes que tener en cuenta los siguientes requisitos: El texto principal: El color del texto es azul: #00F. El color de fondo del texto es verde claro: #CFC. El tipo de letra es la secuencia: Georgia, Cambria, serif. El tamaño del texto: 16px. El encabezado de nivel 1: El color del texto es rojo claro: #F00. El tipo de letra es la secuencia: Verdana, Calibri, sans-serif. El tamaño del texto: 32px. El encabezado de nivel 2: El color del texto es rojo claro: #A00. El tipo de letra es la secuencia: Verdana, Calibri, sans-serif. El tamaño del texto: 24px. El color de los campos de los datos del libro es verde oscuro: #060. El texto "Internet" y la "Web...