在 CSS 樣式表中,可以使用 border-bottom 屬性繪制一條橫線。
.line{ border-bottom: 1px solid black; }
如果需要繪制多條橫線,可以使用偽元素 ::before 或 ::after 實現。比如,以下代碼可以繪制三條橫線:
.line{ position: relative; } .line::before{ content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: black; transform: translateY(-50%); } .line::after{ content: ""; position: absolute; top: 25%; left: 0; width: 100%; height: 1px; background-color: black; }
使用上述代碼,可以繪制一條在中心位置的粗線和兩條在上下位置的細線。
下一篇css 繪制梯形