<p><a href="">フレックスを使用したボタン</a></p>
p{
width: auto;
height: auto;
}
p a{
display: flex;
justify-content: center;/* 左右 */
align-items: center;/* 上下 */
width: 300px;
height: 100px;
background-color: #333;/* 背景色 */
border-radius: 10px;/* 角丸 */
color: #fff;/* 文字カラー */
text-decoration: none;/* アンダーライン消す */
}
/* ホバー設定 */
p a:hover{
background-color: #888;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.