html – 如何在css中的风格：产品…(价格)？

概述对我来说很难解释我在一个问题上想要实现什么.我实际上是在一个小提琴中建造的,但是我知道他们要做一个更聪明的方法： http://jsfiddle.net/4QgtM/1/    我想要实现的 Car ............................... $2000Boat ............................. $20000Airplane .......... 对我来说很难解释我在一个问题上想要实现什么.我实际上是在一个小提琴中建造的,但是我知道他们要做一个更聪明的方法： http://jsfiddle.net/4QgtM/1/

我想要实现的@H_404_3@

Car ............................... 00Boat ............................. 000Airplane ........................ 0000

我有(Hack)@H_404_3@

<ul><li><a href="JavaScript:voID(0)">Car</a><i></i><span>00</span></li><li><a href="JavaScript:voID(0)">Boat</a><i></i><span>000</span></li><li><a href="JavaScript:voID(0)">Airplane</a><i></i><span>0000</span></li>

有没有人有一个聪明的方式来实现这一点？谢谢！@H_404_3@解决方法 检查出来(灵感来自 this)

Fiddle@H_404_3@

CSS：@H_404_3@

ul.leaders {    max-wIDth: 40em;    padding: 0;    overflow-x: hIDden;    List-style: none}ul.leaders li:before {    float: left;    wIDth: 0;    white-space: nowrap;    content:". . . . . . . . . . . . . . . . . . . . "". . . . . . . . . . . . . . . . . . . . "". . . . . . . . . . . . . . . . . . . . "". . . . . . . . . . . . . . . . . . . . "}ul.leaders span:first-child {    padding-right: 0.33em;    background: white}ul.leaders span + span {    float: right;    padding-left: 0.33em;    background: white}

HTML：@H_404_3@

<ul class=leaders>    <li><span><a href="JavaScript:voID(0)">Car</a></span>    <span>0</span>    <li><span><a href="JavaScript:voID(0)">Boat</a></span>    <span>00</span>    <li><span><a href="JavaScript:voID(0)">Airplane</a></span>    <span>000</span>    <li><span><a href="JavaScript:voID(0)">Hover craft</a></span>    <span>0000</span>    <li><span><a href="JavaScript:voID(0)">Supersonic futuristic machine</a></span>    <span>00000</span></ul>

“只是为了纪录”： – 另一个解决方案是在img / png中有一个小点作为背景. (background：#FFF url(image.pn)repeat-x; – 另外还有一个解决方案是边框底部：点缀;@H_404_3@ 总结

以上是内存溢出为你收集整理的html – 如何在css中的风格：产品…(价格)？全部内容，希望文章能够帮你解决html – 如何在css中的风格：产品…(价格)？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。