Question

我是网络编程的新手，我遇到以下问题：

我希望从左侧显示开始的数据。也就是说，将其视为一个屏幕：

Screen                                                                       2332

如果2332增加到2339900，那么我的屏幕应为：

Screen                                                                    2339900

我有这样的代码：

    <table class="table">
        <tbody>
        <tr>
            <td><b>Units entered</b></td>
            <td>123</td>
        </tr>
        <tr>
            <td><b>Consumption charges</b></td>
            <td>23232323</td>
        </tr>
        <tr>
            <td><b>Fixed charges</b></td>
            <td>323232323</td>
        </tr>
        <tr>
            <td><b>Net Amount</b></td>
            <td>3223232332</td>
        </tr>
        </tbody>
    </table>

我尝试将style="float: left;"添加到我的td代码中，但这对我没有帮助。

我如何才能实现这一目标。

注意：我正在使用bootstrap，如果偶然的bootstrap支持它？

提前致谢。

Answer 1

Demo Here

只需使用以下align="right" ......

<table class="table" width="100%">
            <tbody>
            <tr >
                <td><b>Units entered</b></td>
                <td align="right">123</td>
            </tr>
            <tr>
                <td><b>Consumption charges</b></td>
                <td align="right">23232323</td>
            </tr>
            <tr>
                <td><b>Fixed charges</b></td>
                <td align="right">323232323</td>
            </tr>
            <tr>
                <td><b>Net Amount</b></td>
                <td align="right">3223232332</td>
            </tr>
            </tbody>
        </table>

Answer 2

你可以做两件事（至少从头顶开始！）：

使用Bootstrap的脚手架：

<div class="span12">
    <div class="row">
       <div class="span3"><strong>Units entered</strong></span>
        <div class="span3 offset6">123</span>
    </div>
</div>

样式表：

HTML：

    <tr>
        <td><b>Units entered</b></td>
        <td class="align-right">123</td>
    </tr>

CSS：

    .align-right { text-align:right; }

Answer 3

Bootstrap在最新版本中内置了实用程序类“text-right”，因此您只需将该类应用于TD即可。我的jsfiddle显示了实用程序类的功能但你不必实际包含CSS，因为Bootstrap已经拥有了它。您只需要使用类名。

详细信息：http://twitter.github.com/bootstrap/base-css.html#typography

以下是您将如何做到这一点：http://jsfiddle.net/mpPP6/

 .text-right {
     text-align: right;
 }

<table width="100%">
        <tbody>
        <tr>
            <td><b>Units entered</b></td>
            <td class="text-right">123</td>
        </tr>
        <tr>
            <td><b>Consumption charges</b></td>
            <td class="text-right">23232323</td>
        </tr>
        <tr>
            <td><b>Fixed charges</b></td>
            <td class="text-right">323232323</td>
        </tr>
        <tr>
            <td><b>Net Amount</b></td>
            <td class="text-right">3223232332</td>
        </tr>
        </tbody>
    </table>

P.S我建议您将'b'标签换成'强'标签，或者甚至为想要拥有强文本的TD添加一个类，并通过css设置它：

.myclass {
    font-weight: bold;
}

要覆盖Bootstrap的.table类，它将表格单元格中左边的所有内容对齐，只需将此行添加到自定义css文件中。

.table .text-right {
    text-align: right;
}

Answer 4

使用

<td align="left">

将左对齐单元格的内容。看着你的＆＃34;屏幕＆＃34;，数字似乎是正确对齐的？

如何从左边开始显示元素？

4 个答案: