Link Button

index.html

<a href="" class="link-btn">Sample</a>

link-button.markdown

Link Button

A Pen by tomoko on CodePen.

License.

style.scss

/* Google Font */
@import url('https://fonts.googleapis.com/css?family=Ubuntu');

@mixin font-default {
  font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif;
  font-style: normal;
}

@mixin font-Ubuntu {
  font-family: Ubuntu;
  font-style: normal;
}

.link-btn {
  @include font-Ubuntu;
  
  display: block;
  width: 300px;
  padding: 15px 20px;
  font-size: 25px;
  letter-spacing: 0.03em;
  text-decoration: none;
  text-align: center;
  border: 3px solid;
  box-sizing: border-box; /*要素の幅にpaddig,borderを含める*/
  background-color: #FFFFFF;
  color: #000000;
}