日々精進

新しく学んだことを書き留めていきます

webで丸いボタンを作る

border-radiusの値をwidth,heightの半分の値にすればいい。 例は以下。

.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.42;
  border-radius: 15px;
}
<a href="#" class="btn btn-default btn-circle"><i class="fa fa-user"></i></a>

参考: