虚线 Html 跨度

Question

我这里有一个用 html 编码的菜单，但我需要一条虚线来跨越名称和价格，我将如何在这里做呢？我有点迷路哈哈。

你可以在这里看到它。

http://mystycs.com/menu/menuframe.htm

我知道我可以使用 css 来做到这一点，但我将如何跨越这两者。

谢谢 =)

原文由 soniccool 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

<style type="text/css">
 .menugroup{
    width:100%;
 }

 .itemlist{
        list-style-type: none;
 }

 .separator{
        margin: 5px;
        width:50%;
        border-bottom: 1px dotted #000
 }

</style>

<div class="menugroup">

   <ul class="itemlist">
      <li>item name<span class="separator"></span>price</li>
   </ul>

</div>

原文由 Gabe 发布，翻译遵循 CC BY-SA 4.0 许可协议