html怎么让页面居中显示？使用HTML/CSS可以让页面水平、垂直居中显示，以下是几种方法：
1. 使用margin属性实现
可以使用`margin`属性来实现页面居中显示，具体步骤如下：
1. 在CSS中为`<body>`元素设置`text-align:center;`属性，以使页面中的所有元素水平居中。
2.
在CSS中为要居中的元素添加`margin`属性，并将其值设置为`auto`，以使元素在水平和垂直方向上都居中。
例如，下面的代码可以将整个页面居中显示：
<!DOCTYPE html>
<html>
<head>
<title>居中显示页面</title>
<style>
body {
text-align: center;
}
.page-wrapper {
width:
80%;
margin: auto;
background-color: #f1f1f1;
padding: 20px;
}
</style>
</head>
<body>
<div
class="page-wrapper">
<!-- 页面内容 -->
</div>
</body>
</html>
在上面的代码中，`body`元素设置了`text-align:center;`属性，使页面中的所有元素水平居中。`margin:auto;`属性将`.page-wrapper`元素在水平和垂直方向上都居中，即使浏览器窗口大小发生变化，也不会影响居中效果。
2. 使用flexbox布局实现
使用flexbox布局可以更方便地将元素水平、垂直居中。具体步骤如下：
1. 在CSS中为`<body>`元素设置`display:flex;`属性，以启用flexbox布局。
2.
在CSS中为要居中的元素添加flexbox容器属性`display:flex;`和项目属性`align-items:center;`和`justify-content:center;`，以使元素在水平和垂直方向上都居中。
例如，下面的代码可以将整个页面居中显示：
<!DOCTYPE html>
<html>
<head>
<title>居中显示页面</title>
<style>
body {
display: flex;
align-items: center;
justify-content:
center;
height: 100vh;
}
.page-wrapper {
width:
80%;
background-color: #f1f1f1;
padding: 20px;
}
</style>
</head>
<body>
<div
class="page-wrapper">
<!-- 页面内容 -->
</div>
</body>
</html>
在上面的代码中，`body`元素设置了`display:flex;`属性，启用了flexbox布局，并使用`align-items:center;`和`justify-content:center;`属性将元素在水平和垂直方向上都居中。`height:100vh;`属性可以使`.page-wrapper`元素占据整个浏览器窗口高度，从而实现垂直居中效果。
