El código es el siguiente:
Código :
body {
background: -moz-repeating-linear-gradient(45deg, #005588, #00aacc 30px, #eee 30px, #eee 71px);
background: -webkit-repeating-linear-gradient(45deg, #005588, #00aacc 30px, #eee 30px, #eee 71px);
background-size: 100px 100px;
}
Listo. Con esto vas a tener el fondo de tu website como si fuera una textura de líneas diagonales. Explico el código:
Para crear estas líneas diagonales de manera repetitiva empiezo haciéndolo con “repeating-linear-gradient” en la propiedad “background”.
Luego, debo definir los valores que llevará el degradado.
- Lo primero que me pide es la inclinación (o rotación) en ángulos, que para el ejemplo le he asignado 45 grados (deg); esto significa que las líneas que están en constante repetición estarán ubicadas de manera diagonal.
- El siguiente valor es la posición de cada línea.
Por último, se asigna una nueva propiedad “background-size” indicando que el ancho y alto de la pantalla debe medir lo máximo posible.
[nota:51506897cf]Este ejemplo funciona en Firefox desde la versión 3.6, y en Chrome y Safari desde las versiones 5.1.[/nota:51506897cf]
Ver ejemplo aquí
No hay comentarios:
Publicar un comentario