Question

我正在为当地餐馆设计一个网站，我想将他们的食物菜单创建为常规的html页面。格式看起来像这样：

牛排.................. $ 15

鱼.................... $ 17

鸡.............. $ 12

这些时期表示空间。菜肴是合理的，价格合理。

在野蛮主义的黑暗时代，方法是使用表格，并且对齐=＆＃34;右边＆＃34;每行的第二个td。（至少那是人们告诉我的。我永远不会做那么粗暴的事情！）

使用div，我唯一能想到的就是非常麻烦：

<div style="float: left">Steak</div>
<div style="float: right;text-align: right">$15</div>
<div style="clear: both"></div>

或者，一些改进：

<div>Steak
<div style="float: right;text-align: right">$15</div>
</div>

当然，我将样式放入样式表并使用类，但你明白了。

有更简单的方法吗？它看起来像是一个非常多的div。谢谢你的帮助

Answer 1

这就是你想要的

＆＃13;

.left{float: left;margin-left:50px}
.right{float: right;margin-right:150px}

＆＃13;

        <div class="menu">
            <span class="left">Steak</span><span class="right">$15</span><br>
            <span class="left">Fish</span><span class="right">$17</span><br>
            <span class="left">Chicken</span><span class="right">$12</span><br>

＆＃13;

格式化食物菜单的最佳方式

1 个答案:

这就是你想要的