我有一个简单的表单，我只需要它位于页面中间。就像，直接在在中间。但无论我在CSS文件中做了什么更改，它都会停留在页面的左侧。
我的HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Search</title>
</head>
<link rel="stylesheet" href="search.css" type="text/css">
<body>
<div>
<form action="https://google.com/search">
<input id="search" type="text" name="q">
<br>
<input id="button" type="submit" value="Google Search">
</form>
</div>
</body>
</html>您可以使用flexbox的align-items属性：
body{
display:flex;
align-items:center;
justify-content:center;
height:100vh;
}<!DOCTYPE html>
<html lang="en">
<head>
<title>Search</title>
</head>
<link rel="stylesheet" href="search.css" type="text/css">
<body>
<div>
<form action="https://google.com/search">
<input id="search" type="text" name="q">
<br>
<input id="button" type="submit" value="Google Search">
</form>
</div>
</body>
</html>