Bordering.css

Bordering.css.markdown

Bordering.css

縁取り.sass

A Pen by TOBY on CodePen.

License.

index.html

h1.bordering
    縁取り.css
    
h1.invert-bordering
    縁取り.css
    

style.css

@mixin bordering($color: white, $blur-size: 1px, $offset: 1px)
  text-shadow: $color $offset 0px $blur-size, $color 0px $offset $blur-size, $color (-$offset) 0px $blur-size, $color 0px -($offset) $blur-size, $color $offset $offset $blur-size, $color (-$offset) (-$offset) $blur-size, $color (-$offset) $offset $blur-size, $color $offset (-$offset) $blur-size

.bordering
  @include bordering(white, 1px, 2px)

.invert-bordering
  color: white
  @include bordering(#000, 2px, 3px)


    
//----------------------------
body
  text-align: center
  background: url(http://placecreature.com/Squirrel/800/600)
  background-size: cover
  
h1
  margin-top: 1em
  font-size: 4em
  font-family: serif
  font-weight: bold
  text-transform: uppercase