elementui的分割线

Element UI 是一套构建于 Vue.js 之上的组件库，提供了丰富的原生级视觉效果和响应式设计所需的元素组件。在 Element UI 中，`分隔线`（Split line 或 Dividers）是一个用于添加视觉分隔、增强页面布局清晰度的简单而实用的组件。

### 分割线的基本使用

#### HTML 结构

<template>
  <div>
    <!-- 使用 div 来模拟分隔线 -->
    <div class="el-divider" style="background-color: #eee; height: 1px;"></div>
  </div>
</template>

#### CSS 样式
可以自定义分割线的颜色、高度等样式属性：

.el-divider {
  background-color: #ccc;
  width: calc(50% - 4px);
  margin-top: 16px;
  margin-bottom: 16px;
}

#### Element UI 自带组件
Element UI 提供了一个名为 `Divider` 的组件，可以直接使用它来创建分隔线，无需手动编写 CSS：

<template>
  <div>
    <!-- 直接使用 Element UI 的 Divider 组件 -->
    <el-divider></el-divider>
  </div>
</template>

#### 添加额外功能
通过插槽和 prop 属性，你可以为分割线添加标题或其他内容，并调整其位置和对齐方式：

<template>
  <div>
    <el-divider content-position="center">分割线标题</el-divider>
  </div>
</template>

###