如何让div里的内容居中

要让div里的内容居中，可以使用CSS的布局方法。其中，grid布局和flex布局都可以实现这个效果。

使用grid布局，可以通过设置父元素的display为grid，然后使用place-items属性将子元素居中。例如：

<div style="display: grid; place-items: center;">
  <div>块级元素</div>
</div>

使用flex布局，可以通过设置父元素的display为flex，然后使用justify-content和align-items属性将子元素水平和垂直居中。例如：

<div style="display:flex;justify-content: center; align-items:center; width: 500px;height: 200px;border: 1px solid green;text-align:center;line-height:100px ">
  <div style="width: 100px;height: 100px;border: 1px solid gold">块级元素</div>
</div>

以上是两种常用的方法，可以根据具体需求选择适合的布局方式来实现div内容的居中。\[1\]\[2\]
#### 引用[.reference_title]
- *1* *2* [div居中方法（共9种）](https://blog.csdn.net/qq_36608036/article/details/123124742)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [div居中方法（共8种）](https://blog.csdn.net/qq_41425194/article/details/124401426)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]