Skip to content

Instantly share code, notes, and snippets.

@Cartman0
Last active September 21, 2015 18:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Cartman0/b155b4636a8c35282517 to your computer and use it in GitHub Desktop.
Save Cartman0/b155b4636a8c35282517 to your computer and use it in GitHub Desktop.
cssで水玉模様
@mixin background-radial-gradient($value...){
background: -moz-radial-gradient($value);
background: -webkit-radial-gradient($value);
background: radial-gradient($value...);
}
@mixin background-size($value...){
-moz-background-size: $value;
-webkit-background-size: $value;
background-size: $value;
}
@mixin polka-dot($width: 100px, $height: 100px, $color1: white, $color2: black, $dot_num: 3){
width: $width;
height: $height;
@include background-radial-gradient(
circle closest-side,
$color1,
$color1 50%,
$color2 50%,
$color2
);
@include background-size(($width/$dot_num) ($height/$dot_num));
}
.polka-dot {
$width: 100px;
$height: 100px;
$color1: white;
$color2: black;
$num: 5;
@include polka-dot($width, $height, $color1, $color2, $num);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment