html li 点击【html按钮点击效果：代码示例】

HTML中的li元素是用来创建一个无序列表或有序列表中的列表项。当我们点击列表项时，可以通过添加一些CSS样式来实现按钮点击效果。

我们可以为li元素添加一个class属性，用来标识该列表项是一个按钮。然后，我们可以使用CSS选择器来选择这些具有按钮样式的列表项，并为它们添加一些样式。

示例代码如下所示：

<style>
  .button-item {
    cursor: pointer;
    padding: 10px;
    background-color: #ccc;
    border: 1px solid #000;
    border-radius: 5px;
  }
  .button-item:hover {
    background-color: #aaa;
  }
</style>
<ul>
  <li class="46bc-bfc1-7eca-7dbe button-item">按钮1</li>
  <li class="bfc1-7eca-7dbe-443a button-item">按钮2</li>
  <li class="7eca-7dbe-443a-3989 button-item">按钮3</li>
</ul>

在上面的示例代码中，我们首先定义了一个名为`.button-item`的CSS类，用来表示具有按钮样式的列表项。这个类设置了一些样式，比如鼠标指针样式为手型，内边距为10像素，背景颜色为灰色，边框为黑色，边框圆角为5像素。

接着，我们使用`:hover`伪类选择器来为鼠标悬停在按钮上时添加一些样式。在这个示例中，我们将按钮的背景颜色改为浅灰色。

通过以上的CSS样式，当我们将鼠标悬停在按钮上时，按钮的背景颜色会变化，从而实现了按钮点击效果。