html - 对齐表中的货币值

标签 html css

<分区>

例如,我有一个货币值:

4.50€, 25.30€, 446,60€

我将 td text-align 属性设置为 right

  4.50€
 25.30€
446.60€

现在唯一的问题是我所有的内容现在都从 td 的右侧开始。

我想要实现的是正确的文本格式左侧开始。

类似的东西:

id     |money     |
-------------------
0      |  4.50€   |
1      | 25.30€   |
2      |446.60€   |

最佳答案

如果您的内容是静态的,那么您可以尝试以下操作:-

 <style>
        td, th{
            border: 1px solid #777;
        }
        td{
            width: 100px;
        }
        td div{
            width: 42%;
            text-align: right;
        }
    </style>
</head>
<body>
    <table>
        <tr>
            <th>
                SL No.
            </th>
            <th>
                Price
            </th>
        </tr>
        <tr>
            <td>
                1
            </td>
            <td>
                <div>4.2</div>
            </td>
        </tr>
        <tr>
            <td>
                2
            </td>
            <td>
                <div>4.22</div>
            </td>
        </tr>
        <tr>
            <td>
                1
            </td>
            <td>
                <div>4.222</div>
            </td>
        </tr>
    </table>
</body>

但我知道,如果内容是动态的,它并不能完全解决问题。

关于html - 对齐表中的货币值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24233517/

上一篇:css - 没有 CSS 样式的新菜单链接

下一篇:用于显示 HTML 导航元素的 PHP SESSION 变量

相关文章:

javascript - 添加类时单击时停止 jquery 循环函数

php - 将 HTML 模板与 Wordpress PHP 文件混合

javascript - 使用按钮更新图表和文本 (D3.js)

html - 社交插件

css - 父 div 的高度为零,即使它有高度有限的子元素

html - 如何将 flex column child 设置为可用高度?

html - 如何在单击单选按钮时显示 CSS 边框

html - 在 chrome 中为选择设置渐变背景

html - Nav brand 和 nav pills 不在同一条线上

html - 使用 CSS 动画缩放居中的 div 时的不稳定行为