<div class="container">
<a href="#" class="btn-denim">PUSH ME</a>
</div>
/* ここはコピーしなくてOK */
.container {
font-family: "Yu Gothic", YuGothic, Verdana, 'Hiragino Kaku Gothic ProN','Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, sans-serif;
text-align: center;
padding-top: 40px;
}
/* ここから下がボタンのCSS */
.btn-denim {
display: inline-block;
max-width: 180px;
text-align: left;
background-color: #293b6a;
font-size: 16px;
color: #FFF;
text-decoration: none;
font-weight: bold;
padding: 8px 16px;
border: 1px dashed #FFF;
box-shadow: 0px 0px 0px 5px #293b6a;/* box-shadowで外枠を */
}
.btn-denim:hover {
border-style: solid;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.