下面是一个使用HTML、CSS和JavaScript实现按钮下拉功能的示例代码：

HTML代码：

下拉菜单

  选项1
  选项2
  选项3

CSS代码：

#dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
#dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}
#dropdown-content a:hover {
  background-color: #f1f1f1;
}

JavaScript代码：

var dropdownBtn = document.getElementById("dropdown-btn");
var dropdownContent = document.getElementById("dropdown-content");

dropdownBtn.addEventListener("click", function() {
  if (dropdownContent.style.display === "none") {
    dropdownContent.style.display = "block";
  } else {
    dropdownContent.style.display = "none";
  }
});

这段代码实现了一个简单的下拉菜单功能。当按钮被点击时，通过切换下拉菜单的display样式属性来显示或隐藏下拉内容。最初，下拉内容的display样式被设置为none，因此默认情况下是隐藏的。点击按钮后，通过判断下拉内容的当前显示状态来切换其display样式属性的值。如果下拉内容当前为隐藏状态，则将其显示出来；如果下拉内容当前为显示状态，则将其隐藏起来。