css - 正方形内的字母

Question

<分区>

Answer 1

首先简单地创建类似下面的 HTML 和 CSS 的内容:

HTML

<ul>
    <li> <a href="#">1</a> </li>
    <li> <a href="#">2</a> </li>
    <li> <a href="#">3</a> </li>
    <li> <a href="#">4</a> </li>
</ul>

CSS

li {
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: center;
    border: solid 1px #888;
    line-height: 25px;
}
li a {
    display: block;
}

See example here

在选择器之前/之后使用 CSS 添加数字- See this example.