在網頁設計中,按鈕選中效果是非常重要的。通過CSS可以實現不同的按鈕選中效果。
/* 點擊/選中按鈕效果 */ .btn-clicked { background-color: #FFA500; /* 改變背景色 */ color: #fff; /* 改變文本顏色 */ border: none; /* 取消邊框 */ } /* 鼠標懸停按鈕效果 */ .btn-hover { background-color: #40E0D0; /* 改變背景色 */ color: #fff; /* 改變文本顏色 */ } /* 默認按鈕效果 */ .btn { background-color: #fff; /* 背景色 */ color: #000; /* 文本顏色 */ border: 1px solid #ccc; /* 邊框 */ padding: 10px 20px; /* 內邊距 */ cursor: pointer; /* 鼠標樣式 */ } /* 禁用按鈕效果 */ .btn-disabled { background-color: #ccc; /* 改變背景色 */ color: #000; /* 改變文本顏色 */ cursor: not-allowed; /* 鼠標樣式 */ }
以上是常見的幾種按鈕選中效果,可以根據實際需求進行修改和定制。