Question

我创建了一个注册表单，之后将使用PHP将其与SQL数据库连接。问题是我无法在表格内居中提交按钮。据我所知，HTML5不支持表功能。所有HTML代码都在PHP文件中。

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="main.css">
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body> 
        <section>
            <form action="#" method="post">
            <table> 
            <tr>
                <td><label>Full Name:</label><td>
                <td><input type="text" placeholder="Full Name" name="name" ><br></td>
            </tr>
            <tr>
                <td><label>E-mail:</label><td>
                <td><input type="email" placeholder="E-mail" name="email" ><br><td>
            </tr>
            <tr>
                <td><label>Username:</label><td>
                <td><input type="text" placeholder="Username" name="username" ><br><td>
            </tr>
            <tr>
                <td><label>Password:</label><td>
                <td><input type="password" placeholder="Password" name="password" ><br><td>
            </tr>
            <tr>
                <td><input type="submit" name="Registration" value="Submit" ><br><td>
            </tr>
            </table>
        </form>
        </section>
    </body>
</html>

body {
    background: #40E0D0;
    background: -webkit-linear-gradient(to right, #FF0080, #FF8C00, #40E0D0);
    background: linear-gradient(to right, #FF0080, #FF8C00, #40E0D0);
}
form {
    text-align: center;
    display: flex;
    justify-content: center;
}
table {
    display: flex;
    background-color: lightcyan;
    margin: 15px;
    padding: 15px;
}
tr {
    text-align:center;
}
td {
    margin-right: 10px;
}
input {
    width: 300px;
    height: 25px;
}

Answer 1

1）。您应该在最后一个td中添加一个colspan。 2）。确保关闭标签的格式正确->关闭“ td”标签时，应使用</td>。请参阅下面的更新的HTML：

    <!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="main.css">
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body> 
        <section>
            <form action="#" method="post">
            <table> 
            <tr>
                <td><label>Full Name:</label></td>
                <td><input type="text" placeholder="Full Name" name="name" ></td>
            </tr>
            <tr>
                <td><label>E-mail:</label></td>
                <td><input type="email" placeholder="E-mail" name="email" ></td>
            </tr>
            <tr>
                <td><label>Username:</label></td>
                <td><input type="text" placeholder="Username" name="username" ></td>
            </tr>
            <tr>
                <td><label>Password:</label></td>
                <td><input type="password" placeholder="Password" name="password" ></td>
            </tr>
            <tr>
                <td colspan="2"><input type="submit" name="Registration" value="Submit" ></td>
            </tr>
            </table>
        </form>
        </section>
    </body>
</html>

如何将表格中的特定项目居中？

1 个答案: