作業メモ 押せるボタンのCSS

この組み合わせで押したら動くぼたんｎ
Click Me

.button {
background-color: #3498db;
color: #fff;
font-size: 16px;
font-weight: bold;
padding: 12px 24px;
border: none;
border-radius: 6px;
cursor: pointer;
transition: all 0.2s ease-in-out;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
display: inline-block;
}

.button:hover {
background-color: #2980b9;
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
transform: translateY(-2px);
}

.button:active {
background-color: #2471a3;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
transform: translateY(1px);
}