06 octubre 2015

Como usar background-image y background-color a la vez en HTML y CSS

10/06/2015   Codigos Taz   0 comentarios

Cuando en nuestro sitio web queremos utilizar background-image y background-color a la vez hacemos lo siguiente:


Nuestro HTML debera tener la siguiente estructura:


<html>
<head>
    <title></title>
</head>
<body>
    <div id="wrap">
    Aqui va todo el contenido de la pagina
    </div>
</body>
</html>


Ahora en nuestro CSS tendremos lo siguiente:


body {
  height: 100%;
  background-image: url("mi_imagen.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
#wrap {
  background: rgba(0,0,0,0.85); //Color negro transparente para que se vea la imagen

}


Y eso es todo, con eso tendremos una pagina web con una imagen de fondo y color transparente para que se aprecie la imagen

-->

0 comentarios :

▼▲ Mostrar / Ocultar comentarios

Publicar un comentario

Deja tus comentarios respecto al contenido de este post

Búsqueda avanzada