Autor Tema: CSS. Selector: id. (Aplicar CSS a partes de una web) Ejercicio resuelto CU1011D  (Leído 1936 veces)

Jack_F

  • Visitante
Selectores CSS: id. Aplicar CSS a partes de una web. Ejemplos. Diferenciar etiquetas HTML en ids (CU01011D)

Hola de nuevo aqui esta el ejercicio resuelto CU01011D del tutorial básico para la programación web de aprenderaprogramar.com.

Código HTML
Código: [Seleccionar]
<!DOCTYPE html>

<html>

<head>

<title>Portal web - aprenderaprogramar.com</title>

<meta name="description" content="Portal web aprenderaprogramar.com"/>

<meta name="keywords" content="aprender, programar, cursos, libros"/>

<meta charset="utf-8"/>
<link rel="stylesheet" type="text/css" href="datos/css/estilos.css" />

</head>

<body>

<div id="Novedades">

<h1>Novedades</h1>

<p>Aquí presentamos las novedades del sitio.</p>

</div>

<div id="xFashion">

<h3>Lanzamos el producto X-FASHION</h3>

<p>Este producto permite estirar la piel hasta dejarla como la de un bebé.</p>

<p><img src="http://i.imgur.com/tq5Bs.png" title="Imagen del producto" alt="imagen producto x-fashion" /></p>

</div>

<div id="tMotion">

<h3>Mejoramos el producto T-MOTION</h3>

<p>Hemos lanzado una nueva versión del producto T-MOTION</p>

<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del proudcto tmotion" alt="imagen producto tmotion" /></p>

</div>

</body>
</html>

Código CSS
Código: [Seleccionar]
#Novedades h1{
color:red;
background-color:yellow;
}
#xFashion h3{
color:green;
}
#xFashion p{
color:green;
}
#tMotion h3{
color:green;
}
#tMotion p{
color:green;
}
« Última modificación: 14 de Enero 2017, 18:08 por Alex Rodríguez »

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:CSS. Selector: id. (Aplicar CSS a partes de una web).CU1011D
« Respuesta #1 en: 28 de Diciembre 2016, 14:12 »
Buenas Jorgito.

El ejercicio está bien resuelto.

Para mejorarlo un poco, el apartado c podrías haberlo resuelto de la siguiente forma:

Código: [Seleccionar]
#xFashion h3, #tMotion h3{
        color:green;
      }

Con el tiempo  te fijarás más en estas cosas y buscarás repetir el menor código posible.

Saludos. ;D

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".