li 元素列表样式改为正方形方块
在 CSS 中，可以通过设置 list-style-type 属性来改变列表项 <li> 前面的标记样式。如果想要将列表项前面的点（默认是圆点）改为正方形，可以使用以下 CSS 代码：
li {
list-style-type: square;
}
如果希望 <li> 前面的方块，大一点，需要做如下调整：
.my-list li {
list-style-type: none; /* 移除默认的列表标记 */
position: relative; /* 使伪元素能够相对于列表项定位 */
padding-left: 20px; /* 为自定义标记留出空间 */
}
.my-list li::before {
content: ''; /* 伪元素的内容为空 */
position: absolute;
left: 0; /* 定位到列表项的左侧 */
top: 50%; /* 垂直居中 */
transform: translateY(-50%); /* 垂直居中调整 */
width: 10px; /* 自定义标记的宽度 */
height: 10px; /* 自定义标记的高度 */
background-color: black; /* 自定义标记的颜色 */
}
对应的 HTML 代码片段：
<ul class="my-list"> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> </ul>