Html 如何使用css垂直对齐冒号？

我想垂直对齐：“，怎么做

    <td>                                         
        <b>ID</b>:<asp:Label ID="ID0" runat="server" Text='<%# Bind("ID") %>'></asp:Label>
        <br></br>
        <b>Name</b>:<asp:Label ID="Name0" runat="server" Text='<%# Bind("Name") %>'></asp:Label>
        <br></br>
        <b>Age</b>:<asp:Label ID="Age0" runat="server" Text='<%# Bind("Age") %>'></asp:Label>
        <br></br>
        <b>Height</b>:<asp:Label ID="Height0" runat="server" Text='<%# Bind("Height") %>'></asp:Label>
        <br></br>
        <b>Education</b>:<asp:Label ID="Education0" runat="server" Text='<%# Bind("Education") %>'></asp:Label>
    </td>
</tr>

身份证件：



姓名：



年龄：



高度：



教育：

您需要使用具有

显示：内联块的元素

，然后可以使用

垂直对齐：中间

编辑

我误解了这个问题。您可以在

标记上设置最小宽度，但不能完全跨浏览器：

<style>
    p b { min-width: 50px; display:inline-block; }
</style>
<p><b>Foo</b>:</p>
<p><b>Bar</b>:</p>

p b{最小宽度：50px；显示：内联块；}
傅：

酒吧：

---

但是，由于您仍在使用表，我建议您使用表本身来保持对齐

您的标记无效，因为

冒号（：）

不在

b

或

asp:Label

内。 改变

ID:

对此

<b>ID :</b><asp:Label ID="ID0" runat="server" Text='<%# Bind("ID") %>'></asp:Label>

ID:

我只是将字段和值拆分为列。然后，您所要做的就是右对齐字段表单元格

CSS:

.left-column
{
    text-align: right;
    font-weight: bold;
}

<table>
    <tr>
        <td>
            <table>
                <tr>
                    <td class="left-column">
                        ID:
                    </td>
                    <td>
                        <asp:Label ID="ID0" runat="server" Text='<%# Bind("ID") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Name:
                    </td>
                    <td>
                        <asp:Label ID="Name0" runat="server" Text='<%# Bind("Name") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Age:
                    </td>
                    <td>
                        <asp:Label ID="Age0" runat="server" Text='<%# Bind("Age") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Height:
                    </td>
                    <td>
                        <asp:Label ID="Height0" runat="server" Text='<%# Bind("Height") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Education:
                    </td>
                    <td>
                        <asp:Label ID="Education0" runat="server" Text='<%# Bind("Education") %>' />
                    </td>
                </tr>
            </table>

        </td>
    </tr>
</table>

HTML:

.left-column
{
    text-align: right;
    font-weight: bold;
}

<table>
    <tr>
        <td>
            <table>
                <tr>
                    <td class="left-column">
                        ID:
                    </td>
                    <td>
                        <asp:Label ID="ID0" runat="server" Text='<%# Bind("ID") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Name:
                    </td>
                    <td>
                        <asp:Label ID="Name0" runat="server" Text='<%# Bind("Name") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Age:
                    </td>
                    <td>
                        <asp:Label ID="Age0" runat="server" Text='<%# Bind("Age") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Height:
                    </td>
                    <td>
                        <asp:Label ID="Height0" runat="server" Text='<%# Bind("Height") %>' />
                    </td>
                </tr>
                <tr>
                    <td class="left-column">
                        Education:
                    </td>
                    <td>
                        <asp:Label ID="Education0" runat="server" Text='<%# Bind("Education") %>' />
                    </td>
                </tr>
            </table>

        </td>
    </tr>
</table>

身份证件：
姓名：
年龄：
高度：
教育：

垂直对齐冒号？？？？？你到底是什么意思？我想要它们：在这两个标签之间垂直对齐并居中，如何做到这一点？我要澄清一点：td{vertical align:middle；}如果td高于内容，则内容在中间垂直对齐。这通常是td垂直对齐的defaut值如果这不是问题，brs到底在这里做什么：）？你能告诉我怎么做吗，我不擅长cssok如何将这些冒号放在中心并在这些标记之间垂直对齐？谢谢：）这很简单：p@vinay特加·雷迪。我不知道他是如何从阅读你的问题中猜到这就是你想要的：）@GCyrillus-你怎么没有猜到？这是非常明显的。只需查看标记和“对齐冒号”。阅读上下文线索总是有帮助的。