Html 使用css将表单居中_Html_Css_Forms_Center

Html 使用css将表单居中

html css forms

Html 使用css将表单居中,html,css,forms,center,Html,Css,Forms,Center,我正在尝试使用css创建一个html表单我已经读过其他成员的一些类似问题。但是，我无法理解这一点这是HTML表单： <html> <head> <link rel="stylesheet" type="text/css" href="styles/form_style.css"> <title>My Form</title> </head> <body> <form act

我正在尝试使用css创建一个html表单

我已经读过其他成员的一些类似问题。但是，我无法理解这一点

这是HTML表单：

<html>
<head>
    <link rel="stylesheet" type="text/css" href="styles/form_style.css">
    <title>My Form</title>
</head>
<body>
    <form   action="#">
          <label for="name">Your Name:</label>
          <input type="text" name="name" id="name" /><br />

          <label for="email">Your Email:</label>
          <input type="text" name="email" id="email" /><br />

          <input type="checkbox" name="subscribe" id="subscribe" />
          <label for="subscribe" class="check">Subscribe</label>
    </form>
</div>
</body>
</html>


我的表格
你的名字：


您的电子邮件：


订阅

这是CSS：

<style>
form{
  width: 700px ;
  margin-left: 0 auto;
}
label { 
    text-align:right; 
    width:100px; 
}
input { 
    margin-left: 10px; 
}
label.check, label.radio { 
    text-align:left; 
}
</style>


形式{
宽度：700px；
左边距：0自动；
}
标签{
文本对齐：右对齐；
宽度：100px；
}
输入{
左边距：10px；
}
label.check，label.radio{
文本对齐：左对齐；
}

我试了很长时间。但我仍然无法将表格居中。有什么建议吗？

谢谢

速记属性是

边距

，而不是

左边距

。修复它，它将居中：

form {
  width: 700px ;
  margin: 0 auto;
}

这里是小提琴：

速记属性是

margin

，而不是

margin left

。修复它，它将居中：

form {
  width: 700px ;
  margin: 0 auto;
}

这是小提琴：

magin:0 auto；“将从任何持有它的物体上居中放置你的表单。您可能需要添加一些可以固定表单的内容，并设置该内容的宽度，以便将表单设置为中心。比如说，一张这样的桌子

<html>
<head>
    <link rel="stylesheet" type="text/css" href="styles/form_style.css">
    <title>My Form</title>
</head>
<body>
<table>
<tr>
<td width="1024px">
    <form   action="#">
          <label for="name">Your Name:</label>
          <input type="text" name="name" id="name" /><br />

          <label for="email">Your Email:</label>
          <input type="text" name="email" id="email" /><br />

          <input type="checkbox" name="subscribe" id="subscribe" />
          <label for="subscribe" class="check">Subscribe</label>
    </form>
</td>
</tr>
</table>
</div>
</body>
</html>


我的表格
你的名字：


您的电子邮件：


订阅

我在表格前加了表格。试试看。希望这能有所帮助。

magin:0 auto；”将使您的表单从任何位置居中。您可能需要添加一些可以固定表单的内容，并设置该内容的宽度，以便将表单设置为中心。比如说，一张这样的桌子

<html>
<head>
    <link rel="stylesheet" type="text/css" href="styles/form_style.css">
    <title>My Form</title>
</head>
<body>
<table>
<tr>
<td width="1024px">
    <form   action="#">
          <label for="name">Your Name:</label>
          <input type="text" name="name" id="name" /><br />

          <label for="email">Your Email:</label>
          <input type="text" name="email" id="email" /><br />

          <input type="checkbox" name="subscribe" id="subscribe" />
          <label for="subscribe" class="check">Subscribe</label>
    </form>
</td>
</tr>
</table>
</div>
</body>
</html>


我的表格
你的名字：


您的电子邮件：


订阅

我在表格前加了表格。试试看。希望这有帮助。

非常感谢。但它不起作用。我不明白为什么。我在不同的网站上看到了相同的答案。但它不起作用。非常感谢。谢谢你的帮助，非常感谢。但它不起作用。我不明白为什么。我在不同的网站上看到了相同的答案。但它不起作用。非常感谢。我感谢你的帮助。