如何用CSS繪制兩條直線

在CSS中，我們可以使用border屬性來繪制直線，以下是一個示例，展示如何繪制兩條直線：

1、創(chuàng)建一個HTML元素，例如一個div，用于承載這兩條直線：

<div id="lines-container"></div>

2、使用CSS來定義這個div的外觀，并繪制兩條直線：

#lines-container {
  position: relative;
  width: 200px;
  height: 200px;
}
#lines-container::before, #lines-container::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #000;
}
#lines-container::after {
  top: 199px; /* 調(diào)整這條直線的位置 */
}

在這個示例中，我們使用了偽元素（::before和::after）來繪制兩條直線，這兩條直線分別位于div的頂部和底部，你可以通過調(diào)整top屬性來改變第二條直線的位置，你還可以修改width、height和background-color屬性來調(diào)整直線的樣式。