CSS是前端開發中重要的一部分，它可以用來控制網頁的樣式和排版。其中，分割線也是常見的元素之一，下面我們就來看看如何在CSS里打出分割線。

/* 一條水平分割線 */
.hr {
border-top: 1px solid #ddd;
}
/* 一條垂直分割線 */
.vr {
border-left: 1px solid #ddd;
}

在上面的示例中，我們使用了border屬性來定義分割線。其中，border-top可以用來創建水平分割線，而border-left則可以創建垂直分割線。

在border屬性中，我們需要指定分割線的寬度、樣式和顏色。例如，上面的示例中，我們定義了1像素的實線，顏色為#ddd。如果要定義虛線或點線，可以使用border-style屬性來設置邊框樣式。

除了使用border屬性，我們還可以使用偽元素來創建分割線。例如，下面的代碼就可以實現一條雙線分割線：

.line {
position: relative;
}
.line:before {
content: "";
position: absolute;
top: 50%;
left: 0;
right: 0;
height: 1px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}

上面的代碼中，我們在.line元素上使用了position屬性，使其成為相對定位的容器。然后，使用:before偽元素來創建一個絕對定位的元素，使得它與容器元素的上邊框和下邊框之間保持一個像素的距離，從而成為雙線分割線。

在創建分割線時，我們還需要考慮兼容性問題。一些老舊的瀏覽器可能不支持某些CSS屬性或偽元素，因此在編寫代碼時需要進行兼容性測試和調整。