CSS和JavaScript实现按钮默认按下状态及样式切换

你可以使用CSS来设置按钮的样式，并使用JavaScript来设置按钮的默认状态为按下状态。

HTML代码：

<button id="myButton">按下</button>

CSS代码：

button {
  background-color: gray;
  color: white;
  padding: 10px 20px;
  border: none;
  cursor: pointer;
}
button.active {
background-color: white;
color: gray;
}

JavaScript代码：

const button = document.getElementById("myButton");
button.classList.add("active"); // 设置默认为按下状态
button.addEventListener("click", function() {
button.classList.toggle("active"); // 切换按下状态和非按下状态
});

在上面的代码中，我们首先使用`classList.add()`方法将按钮的类名设置为"active"，以使其默认状态为按下状态。然后，我们使用`addEventListener()`方法为按钮添加了一个点击事件监听器。当按钮被点击时，通过使用`classList.toggle()`方法来切换按钮的类名，从而实现按下和非按下状态的切换。