我正在学习 HTML，但无法在网页中心对齐 HTML 表单。请帮我解决问题。 HTML代码如下：
<body>
<div style="border: 1px solid black; width: 400px; text-align: center;"
align="center">
<form >
<!-- some code -->
</form>
</div>
</body>
【问题讨论】：
将margin: auto; 添加到您的父 div 样式。 text-align 和 align 在那里没有必要。文本对齐会影响您的内部文本的对齐方式，而不是您设置它的容器。
如果您尝试将已知宽度的元素居中，那么您应该使用 margin: 0 auto;.
如果您尝试将元素的内容（文本、图像等）居中，那么您应该使用 text-align: center。
虽然可以使用 text-align: center 通过设置将块元素居中显示为内联（或 inline-block）并在容器上使用 text-align: center 你可能不应该这样做。
也请查看此链接以了解有关保证金如何运作的更多信息CSS Margins
【讨论】：
text-align 不是正确的属性。在您的答案本身中对特定场景进行一些解释会有所帮助。
text-align into style 与简单的align 到div 相同，没有区别。 text-align 通常更常见，因为 align 有点过时，但仍然在某些情况下使用。但是两者都用是没必要的。
从 div 标签中删除对齐中心，并在表单前使用 center 标签并在表单后关闭它。如果它不起作用，请回复。仅供参考，不要使用以像素为单位的 div 宽度，请在像 100% 这样的百分比。如果您以像素为单位使用，当您切换到其他设备（例如移动设备到桌面设备）时，您可能会遇到问题...
【讨论】：
相信你在找
this
<style>
.center {
margin: auto;
width: 400px;
border:1px solid black;
}
</style>
<body>
<div class="center">
<form >
<!-- some code -->
</form>
</div>
</body>
【讨论】：
要达到预期的效果，请使用下面的弹性项目选项
下面提到的将内容垂直和水平居中
对齐项目：居中； // align-items 将内容水平居中
justify-content: center;// justify-content 将内容垂直居中
注意：要让内容垂直居中对齐，请定义 html 和 body 全屏高度 100%，默认情况下 html，body 高度是自动的，不会覆盖整个屏幕
CSS：
html, body{
height:100%;
}
body{
display:flex;
align-items: center;
justify-content: center;
height:100%;
}
Codepen 供参考 - https://codepen.io/nagasai/pen/JJrPRM
【讨论】：
您也可以在表单标签中指定 style="padding-left:200px" 这样做，但这不是设计网站时的好方法
【讨论】：
<body style='border: 2px solid black;'>
<form style='border: 2px solid red;width:50%;margin:0 auto;text-align:center'>
<!-- some code -->
<input type='text'>
</form>
</body>【讨论】：
首先将宽度属性设置为绝对单位（px、cm 等）或相对单位（rem、em、%）然后使用margin-left:auto; and margin-right:auto;
为什么会这样？因为在设置块级元素的宽度后，浏览器（用户代理）可以进行计算，即为auto占位符分配精确值，例如：
freeSpace = parentElementWidth - childBlockLevelElementWidth;
auto = freeSpace/2;
【讨论】：