在CSS中，我們可以使用列表樣式(list-style)屬性來控制我們的列表外觀，包括了列表項前面的點的位置。通常情況下，這些點與列表項的文本之間留有一定的間隔，造成視覺上的不整齊感覺。那么我們該如何解決這個問題呢？

ul {
list-style: none; /* 去除默認的點 */
}
li {
position: relative; /* 設置定位，使得后面的點能夠相對定位 */
padding-left: 20px; /* 設置左內邊距，給點留出位置 */
}
li:before { /* 在每個li元素前插入偽類元素 */
content: ""; /* 必須設置為 "" */
position: absolute; /* 絕對定位 */
top: 50%; /* 調整位置，使得左側的點垂直居中 */
left: 0; /* 距離左側距離 */
transform: translateY(-50%); /* 偏移量，使得點在垂直方向上偏離中心線相同 */
width: 5px; /* 設置點的寬度 */
height: 5px; /* 設置點的高度 */
border-radius: 50%; /* 將點設置為圓形 */
background-color: #000; /* 設置背景顏色 */
}

上面的代碼中，我們首先去掉了默認的點樣式，然后給每個列表項添加一個相對定位。接著通過偽類元素:before在每個列表項前插入一個絕對定位的點，并調整位置使得點在垂直方向上偏離中心線相同，從而達到將點與列表項文本左對齊的效果。