有序列表-html：如何在图像的中间高度设置点（ol {style-list：disc;}）的位置？

Question

有序列表-html：如何在图像的中间高度设置点（ol {style-list：disc;}）的位置？

示例点位于图像底部而不位于中间：

---

示例代码

<ol style="style-list:disc;">
<li><img src="https://t2.gstatic.com/images?q=tbn:MezWc3ku_XBiwM:http://www.whereisacar.com/images/cars/bill-gates-car.jpg"></li>
<li><img src="https://t0.gstatic.com/images?q=tbn:98OwBE0-icyCNM:http://www.comparecheapinsurance.com/car-insurance/images/car-insurance-policy.jpg"></li>
</ol>

我想移动图像或点位置，使该点看起来在图像高度的中间。

编辑：我正在寻找不使用背景点图像的方式，如果存在此选项

Answer 1

首先，将其设为ul而不是ol，如下所示：

<ul class="images">
 <li><img...
 <li><img...
</ul>

然后添加以下CSS：

ul.images img {
    vertical-align: middle;
}

Answer 2

关闭CSS中的项目符号，然后使用<li>上的image作为CSS属性：

ol {
    list-style: none;
}

li {
    background: url(bullet.gif) no-repeat 0 50%;
}

另外，由于您只是显示项目符号，因此使用无序列表<ul>更有意义。