Quiero crear un bonito fondo rayado diagonal u horizontal (amarillo y negro) para http://www.hallmorkshoneybess.co.uk pero no puedo encontrar ningún tutorial sobre cómo hacerlo.2 rayas de color de fondo con o sin imágenes?
Puede por favor ayuda. Gracias
http://lea.verou.me/css3patterns/ aquí hay algunas muestras excelentes que puede usar.
CSS3 isnt 100% aceptado por lo tanto, me gustaría seguir con algo así como http://www.stripegenerator.com
usted puede hacer esto fácilmente usando un gradiente lineal con el color-stops: http://www.techrepublic.com/blog/webmaster/css3-gradients-setting-color-stops/937
guau que parece confuso pero gracias –
¿cómo lo haría con las imágenes? –
si sus rayas deben ser de 2px de ancho y verticalmente, cree una imagen de 4px de ancho y 1px de alto con 2px de cada color. luego agréguelo como imagen de fondo y ajústelo para repetir tanto x como y. – DonJuwe
Se puede utilizar una combinación de CSS3 lineales gradientes y los antecedentes de tamaño & repetición.
Por lo Crinsane dijo que puede hacerlo de esta manera:
background-color: black; background: linear-gradient(white 50%, black 50%); background-size: 100% 20%; background-repeat: repeat-y;
Así que básicamente estamos creando un lineal gradiente de la mitad negro y medio blanco, luego definimos su tamaño como el 20% de su contenedor. Entonces, cuando lo repetimos, recibimos varias rayas.
Cambie el 20% para las rayas de diferentes tamaños, y la proporción del 50% 50% para una proporción diferente de los 2 colores.
Espero que esto ayude.
Generador de bandas ... solo el boleto. gracias. –