css コンポーネントをどのように作るかref：http：//qiita.com/usako/items/de252b7f7e43e5161fcb

Posted 2021-05-13

<a href="#" class="btn theme-default">ボタン</a>
<h2 class="heading theme-default">見出し</h2>

.btn {
    display: inline-block;
    line-height: 1;
    text-decoration: none;
    color: #ddd;
}

.heading {
    display: block;
    font-size: 18px;
    font-weight: bold;
}

.theme-default {
    border-radius: 5px;
    border: 1px solid #ccc;
    padding: 0.6em;
}

<a href="#" class="btn">ボタン</a>
<h2 class="btn heading">見出し</h2>

.btn {
    display: inline-block;
    border-radius: 5px;
    border: 1px solid #ccc;
    padding: 0.6em;
    line-height: 1;
    text-decoration: none;
    color: #ddd;
}

.heading {
    display: block;
    font-size: 18px;
    font-weight: bold;
}