91超碰碰碰碰久久久久久综合_超碰av人澡人澡人澡人澡人掠_国产黄大片在线观看画质优化_txt小说免费全本

溫馨提示×

css3按鈕點擊效果如何實現

小樊
84
2024-10-23 09:57:15
欄目: 編程語言

在CSS3中,可以使用偽類:active來實現按鈕點擊效果。以下是一個簡單的示例:

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CSS3 Button Click Effect</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <button class="btn">Click me</button>
</body>
</html>

CSS (styles.css):

.btn {
  background-color: #4CAF50;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  transition-duration: 0.4s;
}

.btn:active {
  background-color: #45a049;
}

在這個示例中,我們創建了一個名為.btn的按鈕。當用戶點擊按鈕時,:active偽類會使按鈕的背景顏色從#4CAF50變為#45a049,從而產生點擊效果。transition-duration屬性用于設置顏色變化的持續時間。

0
阳高县| 龙口市| 东乡| 开鲁县| 右玉县| 信宜市| 金坛市| 阳东县| 正宁县| 永康市| 夏邑县| 万源市| 仪陇县| 榆中县| 镇平县| 毕节市| 清涧县| 盐边县| 双峰县| 阳信县| 乾安县| 巴林右旗| 清苑县| 专栏| 渝北区| 靖安县| 象山县| 额敏县| 长宁县| 平顺县| 汉寿县| 深泽县| 襄城县| 河东区| 商河县| 台北市| 遂昌县| 沙洋县| 香格里拉县| 山东| 旌德县|