Есть ли способ добавить номер внутри значков JQM

Question

Я пытаюсь заменить значок arrow-l с номерами в JQM для страницы формы.

Вот скрипка Обновленная скрипка

Как вы можете видеть в скрипде, я использую значки arrow-l, что я хочу сделать, это то, как менять эти значки на цифры, такие как 1 ----- 2 -------- 3 ---- 4. .

Спасибо заранее

Answer 1

Рабочий пример: http://jsfiddle.net/gajotres/b33k9/

Просто найдите себя лучше выглядящими значками

HTML:

<div class="ui-block-a"><a class=" center1 ui-shadow ui-btn ui-corner-all ui-btn-icon-notext ui-btn-inline ui-icon-one">Button</a><div class="line" style="margin-left:62%"></div>

</div>

<div class="ui-block-b"><a class=" center1 ui-shadow ui-btn ui-corner-all ui-btn-icon-notext ui-btn-inline ui-icon-two">Button</a><div class="line" style="margin-right:62%"></div><div class="line" style="margin-left:62%"></div>
</div>
<div class="ui-block-c"><a class="center1 ui-shadow ui-btn ui-corner-all ui-btn-icon-notext ui-btn-inline ui-icon-three">Button</a><div class="line" style="margin-right:62%; top:-21px"></div>
    <div class="line" style="margin-left:62%"></div>
</div>
<div class="ui-block-d"><a class="center1 ui-shadow ui-btn ui-corner-all ui-btn-icon-notext ui-btn-inline ui-icon-four" data-icon="four">Button</a><div class="line" style="margin-right:62%;top:-21px"></div>

.

CSS:

.ui-icon-one:after {
    background-image: url('http://secondavenuesagas.com/images/bullets/1.gif');
}

.ui-icon-two:after {
    background-image: url('http://secondavenuesagas.com/images/bullets/2.gif');
}

.ui-icon-three:after {
    background-image: url('http://secondavenuesagas.com/images/bullets/3.gif');
}

.ui-icon-four:after {
    background-image: url('http://secondavenuesagas.com/images/bullets/4.gif');
}

.