Repita CSS Antecedentes
-
16-09-2019 - |
Pregunta
¿Hay alguna manera de hacer un tramo imagen de fondo en lugar de repetir?
Solución
No utilizar ningún tipo de multi-navegador compatible con CSS (no la propiedad background-size
sin embargo.)
Si esto está dirigido a cualquier navegador, en particular, podría ser posible. De lo contrario, tendrá que utilizar un <img>
y estirar eso.
Así es como se hace en los navegadores recientes:
body {
background-image: url(bg.jpg);
-moz-background-size: 100% 100%; /* Gecko 1.9.2 (Firefox 3.6) */
-o-background-size: 100% 100%; /* Opera 9.5 */
-webkit-background-size: 100% 100%; /* Safari 3.0 */
-khtml-background-size: 100% 100%; /* Konqueror 3.5.4 */
}
De lo contrario, el uso de un <img>
:
img#background {
/* height: 100%; Note: to keep ratio, don't use height */
left: 0;
position: fixed; /* or absolute, if you like */
top: 0;
z-index: -1;
width: 100%;
}
Otros consejos
Se podría utilizar una imagen y ajuste que es ancho y la altura a 100%, z-index a la posición -1 a absoluta. Eso podría funcionar.
fondo de tamaño es CSS3 y no es compatible. Usted podría tomar un vistazo a este artículo: ¿Cómo se estira una imagen de fondo en una Página web
Espero que esto ayude.
body
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}
http://www.w3schools.com/css/css_background.asp
Esto no streach su imagen, sino que hará que la imagen no se repita.