怎么让div左右居中

要在HTML中创建一个水平居中的`<div>`元素，你可以通过CSS来实现。主要有两种常见的方法：

1. **Flexbox** 方法：
如果你的浏览器支持Flexbox布局，可以将包含`<div>`的容器设置为`display: flex; justify-content: center;`。例如：

   <style>
     .container {
       display: flex;
       justify-content: center;
     }
     
     .centered-div {
       /* 其他样式 */
     }
   </style>

   <div class="container">
     <div class="centered-div">你的内容</div>
   </div>

2. **Grid** 方法：
使用CSS Grid时，同样将容器设为`display: grid; align-items: center;`。如果你只希望水平居中，那么只需要`justify-content: center;`。

   <style>
     .container {
       display: grid;
       justify-content: center;
       align-items: center;
     }
     
     .centered-div {
       /* 其他样式 */
     }
   </style>

   <div class="container">
     <div class="centered-div">你的内容</div>
   </div>

如果你不确定浏览器是否支持这些特性，可以考虑添加一些兼容性的前缀，如 `-webkit-`, `-ms-` 等。