div块里有许多按钮从左到右依次展示这些按钮但是向右靠且按钮之间有一条不接触到div块 上下的边缘的细线分割当鼠标移动到按钮上方时按钮变色反之亦然

你可以使用CSS来实现这个效果。首先，你需要一个包含按钮的div块，然后为每个按钮创建一个<button>元素。然后，使用CSS样式来设置按钮之间的分割线和鼠标悬停时的颜色变化。

HTML代码：

<div class="button-container">
  <button>按钮1</button>
  <button>按钮2</button>
  <button>按钮3</button>
</div>

CSS代码：

.button-container {
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 10px;
}

.button-container button {
  border: none;
  background-color: transparent;
  margin-right: 10px;
  padding: 5px 10px;
  cursor: pointer;
}

.button-container button:hover {
  background-color: #ccc;
  color: white;
}

解释：

1. .button-container类设置了div容器的样式，使用display: flex和justify-content: flex-end使按钮向右靠齐。border-top和border-bottom属性设置了分割线。
2. .button-container button选择器设置了按钮的样式，使用margin-right属性设置按钮之间的间距，padding属性设置按钮内部的间距，cursor: pointer属性设置鼠标悬停时的光标样式。
3. .button-container button:hover选择器设置了鼠标悬停时按钮的样式，使用background-color属性设置背景颜色，color属性设置文字颜色。

你可以根据需要调整样式和按钮的数量