解決CSS水平線空心的方法

在CSS中，水平線空心的問題通常是由于邊框樣式或背景顏色設(shè)置不當導致的，為了解決這個問題，可以嘗試以下幾種方法：

1、檢查邊框樣式

檢查元素的邊框樣式設(shè)置，確保邊框樣式為實線，而不是虛線或點線，可以使用border-style: solid;來設(shè)置實線邊框。

2、設(shè)置背景顏色

如果邊框樣式設(shè)置正確，但水平線仍然空心，可以嘗試設(shè)置元素的背景顏色，確保背景顏色與邊框顏色相同，這樣可以消除空心效果，可以使用background-color: #FFFFFF;來設(shè)置白色背景。

3、使用偽元素

如果以上方法無效，可以嘗試使用偽元素（如::before或::after）來創(chuàng)建一個額外的元素，并設(shè)置其邊框樣式和背景顏色，這樣可以將空心水平線替換為實線。

可以使用以下CSS代碼來創(chuàng)建一個實線水平線：

hr {
  border: none;
  border-top: 1px solid #000000;
}

或者，使用偽元素來創(chuàng)建實線水平線：

hr {
  border: none;
}
hr::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #000000;
}