Упорядоченный список - html: Как расположить точку (ol {style-list: disc;}) в средней высоте изображения? - PullRequest
Новая
       9

Упорядоченный список - html: Как расположить точку (ol {style-list: disc;}) в средней высоте изображения?

0 голосов
/ 16 июля 2010

Упорядоченный список - html: Как расположить точку (ol {style-list: disc;}) в средней высоте изображения?

Пример, где точка расположена внизу изображения, а не посередине:

image image

Код примера 

<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>

Моя задача - переместить изображение или точку, которая будет смотреть эту точку в середине высоты изображения.

Редактировать: Я ищу путь без использования фонового точечного изображения, если эта опция существует

Ответы [ 2 ]

3 голосов
/ 16 июля 2010

Прежде всего, сделайте это ul вместо ol, как это: 

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

Затем добавьте этот CSS: 

ul.images img {
    vertical-align: middle;
}
1 голос
/ 16 июля 2010

Отключите маркер в CSS и вместо этого используйте изображение в качестве свойства CSS на

: 
ol {
    list-style: none;
}

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

Кроме того, поскольку вы просто отображаете маркеры, имеет смысл использовать неупорядоченный список

...