我有一个简单的无序列表,其中圆盘为 list-type
。我想使光盘变大,所以我放大了 ul
的字体大小。但是,现在圆盘没有与文本在中间垂直对齐。
我做错了什么?
<div>
<ul>
<li><a href="#">Lorem ipsum</a></li>
<li><a href="#">Lorem ipsum</a></li>
<li><a href="#">Lorem ipsum</a></li>
</ul>
</div>
ul {list-style: disc;font-size: 260%;}
a {font-size: 16px;
line-height: 40px;
display: inline-block;
padding: 10px;
margin: 5px 10px 5px 0;
border:1px solid green}
最佳答案
一种解决方案是使用伪元素before
:
.stops {}
.stops ul {list-style-type: none;}
.stops li {}
.stops a {font-size: 16px;
line-height: 40px;
display: inline-block;
padding: 10px;
margin: 5px 10px 5px 0;
border:1px solid green}
li:before {content:"·";font-size:120px;vertical-align:middle;line-height:20px;}
不必使用 list-style: disc
但 content:"."
并调整字体大小使其看起来像大圆盘。
关于html - 超大列表圆盘未在中间垂直对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25456527/