td数据未正确对齐

时间:2012-10-29 07:53:52

标签: html css html-table

我是Html设计的新手。我必须使用html和CSS设计一小部分页面。

This is the part that I am working on currently

我的背景图像带有登录按钮的图像。如何开发这个Html,使其在附图中看起来相同。

直到现在我已经尝试过了,但它看起来很扭曲:

<div class="dvEmployee">
    <table border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td>
                <br />
                <span class="EmployeeLable">Enter your employee number to vote </span>
            </td>
        </tr>
        <tr>
            <td>
                <asp:TextBox runat="server" ID="txtEmpID" ValidationGroup="vdLog" CssClass="input"
                    Height="49px" Width="161px" /><br />
                <asp:RequiredFieldValidator ID="rfgEmp" runat="server" ValidationGroup="vdLog" ControlToValidate="txtEmpID"
                    ErrorMessage="Please enter employee number!"></asp:RequiredFieldValidator>
                <asp:Label runat="server" ID="lblError" Text="" CssClass="lblError"></asp:Label>
            </td>
            <td>
                <asp:ImageButton ID="imgBtn" runat="server" ImageUrl="Images/log_in_button.png" ValidationGroup="vdLog"
                    AlternateText="Log In" OnClick="imgBtn_Click" />
            </td>
        </tr>
    </table>
</div>

我做过的Css课程:

.dvEmployee
{
    background-image: url('images/log_in_window.png');
    background-repeat: no-repeat;
    width: 466px;
    height: 206px;
    position: relative; /* padding: 100px 30px;*/
    margin: 180px 107px;
    z-index: 2000px;
}

.lblError
{
    font: Arial Regular 12pt #000000;
}

.EmployeeLable
{
    font-family: Arial regular;
    font-size: 29pt;
    color: #404040;
    line-height: 17px;
}

只是为了给所有人,以下图片是它目前的样子:

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:0)

使用此srtuctuer:

 <table>
    <tr>
        <td colspan="2">
            <br />
            <span class="EmployeeLable">Enter your employee number to vote </span>
        </td>

    </tr>
    <tr>
     <td class="center">
        <asp:TextBox runat="server" ID="txtEmpID" ValidationGroup="vdLog" CssClass="input"
                     Height="49px" Width="161px" /><br />
        <asp:RequiredFieldValidator ID="rfgEmp" runat="server" ValidationGroup="vdLog" ControlToValidate="txtEmpID"
                            ErrorMessage="Please enter employee number!"></asp:RequiredFieldValidator>
        <asp:Label runat="server" ID="lblError" Text="" CssClass="lblError"></asp:Label>
    </td>
    <td class="center">
        <asp:ImageButton ID="imgBtn" runat="server" ImageUrl="Images/log_in_button.png" ValidationGroup="vdLog"
                            AlternateText="Log In" OnClick="imgBtn_Click" />
    </td>
    </tr>
</table>

css:

.center{
text-align:center;
}