Ver Mensaje Individual
  #2 (permalink)  
Antiguo 15/09/2014, 02:14
juangemelo01
 
Fecha de Ingreso: marzo-2011
Ubicación: Oaxaca
Mensajes: 252
Antigüedad: 13 años, 9 meses
Puntos: 17
Respuesta: [TUTORIAL] Hacer patrones Repetitivos en CSS

Como verán realmente no es difícil hacer un "dibujo" como patrón repetitivo en CSS, tal vez sea un poquito laborioso, pero no es difícil
en fin el código final seria este
Código:
background:
radial-gradient(circle at 50% 50%, #CFCFCF 4px,  transparent 0) 38px -114px,
/*bocina*/
linear-gradient(190deg, #DBDBDB 4px, transparent 0) -52px 37px,
linear-gradient(10deg, #DBDBDB 4px, transparent 0) -72px 40px,
/*Cuadrado inferior del boton*/
linear-gradient(225deg, #AFCFCF 6px, transparent 0) -54px 244px,
linear-gradient(45deg, #AFCFCF 6px, transparent 0) 139px -29px,
radial-gradient(circle at 50% 50%, #DBDBDB 8px, #CFCFCF 8px,  #CFCFCF 12px, transparent 0) 42px 107px,
linear-gradient(242deg, #3A3A3A 84px, transparent 0) -14px 52px,
linear-gradient(62deg, #303030 84px, transparent 0) 92px -52px,
linear-gradient(245deg, #F8F8F8 108px, transparent 0) -2px 10px,
linear-gradient(65deg, #F8F8F8 108px, transparent 0) 80px -16px;
background-color:#FC5241;
background-size:200px 280px;
y aqui lo podran apreciar mejor
http://codepen.io/elestudiantefantasma/pen/ryDKi

Espero que les haya gustado este tutorial, si tienen dudas, pregunten y con mucho gusto les respondere

PD: pongo esto aqui, ya que mi Tutorial original tenia mas de 14000 caracteres, y solo puedo poner 10000 por tema, si quieren ver como era el Tutorial original, entren aqui
http://www.taringa.net/posts/ebooks-...-Tutorial.html