CSS
.stripes {
height: 250px;
width: 375px;
float: left;
margin: 10px;
/*
-webkit-background-size: 50px 150px;
-moz-background-size: 50px 50px;
background-size: 50px 150px; /* Controls the size of the stripes */
background-size: 50px 50px;
}
.checkered {
background-image: -webkit-gradient(linear, 0% 100%, 100% 0%, color-stop(.33, #fff), color-stop(.33, transparent), to(transparent))
,-webkit-gradient(linear, 100% 100%, 00% 0, color-stop(.33, #fff), color-stop(.33, transparent), to(transparent))
,-webkit-gradient(linear, 0% 0, 0% 100%, color-stop(.5, transparent), color-stop(.5, #f00))
,-webkit-gradient(radial, 32% 37%, 10, 32% 37%, 11, from(#f00), to(transparent))
,-webkit-gradient(radial, 68% 37%, 10, 68% 37%, 11, from(#f00), to(transparent))
,-webkit-gradient(radial, 50% 63%, 10, 50% 63%, 11, from(#f00), to(transparent));
background-image: -moz-linear-gradient(1deg, #555 25%, transparent 25%, transparent),
-moz-linear-gradient(-1deg, #555 25%, transparent 25%, transparent),
-moz-linear-gradient(1deg, transparent 75%, #555 75%),
-moz-linear-gradient(-5deg, transparent 75%, #555 75%);
background-image: -o-linear-box-gradient(1deg, #555 25%, transparent 25%, transparent),
-o-linear-box-gradient(-1deg, #555 25%, transparent 25%, transparent),
-o-linear-box-gradient(5deg, transparent 75%, #555 75%),
-o-linear-box-gradient(-5deg, transparent 75%, #555 75%);
background-image: linear-gradient(45deg, #555 25%, transparent 25%, transparent),
linear-gradient(-45deg, #555 25%, transparent 25%, transparent),
linear-gradient(45deg, transparent 75%, #555 75%),
linear-gradient(-45deg, transparent 75%, #555 75%);
}