<hr> 主題区切り（水平線）要素

<p>§1: ファイトクラブの第一のルール：ファイトクラブについて話してはならない。</p>

<hr />

<p>§2: ファイトクラブの第二のルール：カップケーキを必ず持参すること。</p>

hr {
  border: none;
  border-top: 3px double #333333;
  color: #333333;
  overflow: visible;
  text-align: center;
  height: 5px;
}

hr::after {
  background: white;
  content: "§";
  padding: 0 4px;
  position: relative;
  top: -13px;
}

<article>
  <p>
    これは第一段落のテキストです。これは第一段落のテキストです。
    これは第一段落のテキストです。これは第一段落のテキストです。
  </p>
  <hr />
  <p>
    これは第二段落のテキストです。これは第二段落のテキストです。
    これは第二段落のテキストです。これは第二段落のテキストです。
  </p>
</article>

<ul>
  <li>切り取り</li>
  <li>コピー</li>
  <li>貼り付け</li>
  <li role="presentation"><hr /></li>
  <li>削除</li>
</ul>

ul {
  list-style-type: none;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  width: 100px;
  margin: 0.75rem;
  padding: 0.75rem;
  border: 1px solid lightgrey;
}
hr {
  margin-block: 0.2rem;
  color: lightgrey;
}

<select>
  <option value="">--選択してください--</option>
  <hr />
  <option value="option1">選択肢 1</option>
  <option value="option2">選択肢 2</option>
  <hr />
  <option value="option3">選択肢 3</option>
  <option value="option4">選択肢 4</option>
</select>