[分享]css中怎么加水平 分隔线

CSS中怎么加水平分隔线，今天就来和大家聊一聊。为了让网页更加美观、清晰，通常会添加水平分隔线。下面，我们以示例来说明CSS中如何添加水平分隔线。/ 先定义一个div，作为容器 / / 在div中添...

CSS中怎么加水平分隔线，今天就来和大家聊一聊。

为了让网页更加美观、清晰，通常会添加水平分隔线。下面，我们以示例来说明CSS中如何添加水平分隔线。

/* 先定义一个div，作为容器 */
<div class="container">
  /* 在div中添加两个块状元素 */
  <div class="block"></div>
  <div class="block"></div>
</div> 

现在，我们来编写CSS样式，为容器和块状元素添加样式以形成水平分隔线。

/* 设置容器的宽度 */
.container {
  width: 80%;
  margin: 0 auto;
}

/* 设置块状元素的高度和背景颜色以形成分隔线 */
.block {
  height: 1px;
  background-color: #e1e1e1;
  margin: 10px 0;
} 

以上样式中，我们设置块状元素的高度为1px，背景颜色为#e1e1e1，正好可以形成一条细细的水平分隔线。同时，我们通过设置容器的宽度为80%，使页面中的分隔线在视觉上更加垂直、清晰。

这就是CSS中怎么加水平分隔线的方法，希望对大家有所帮助。