ボタンへの基本的スタイル適用

button要素への基本的なスタイル適用方法。
ボタンの上にカーソルを重ねた時やボタン押下後の状態にもスタイルを適用している。
CSSスタイルを適用したボタン→

CSS


		.btn1{
			background-color:white;
			padding:0.2em;
			border:solid 1px #37c0f8;
			border-radius:2px;
			color:#37c0f8
		}
		.btn1:hover{
			border-color:orange;
			color:orange;
		}
		
		.btn1:focus{
			border-color:#8a99b0;
			color:#8a99b0;
			outline: 1px solid #8a99b0;
		}

HTML

<button class="btn1">TEST1</button>

ボタンへの基本的スタイル適用 | ワクガンス