[分享]CSS中如何让两个div对齐

发布于 2024-11-11 19:26:17

CSS中如何让两个div对齐？
如果想要让两个div水平对齐，可以使用display:inline-block属性。首先，在两个div的CSS样式中加入该属性：

div {
  display: inline-block;
}

然后，将两个div放在同一个父元素中，并使用text-align:center属性来水平对齐：

<div style="text-align:center">
  <div>Div 1</div>
  <div>Div 2</div>
</div>

如果想要让两个div垂直对齐，可以使用vertical-align属性。首先，在两个div的CSS样式中加入该属性：

div {
  display: inline-block;
  vertical-align: middle;
}

然后，将两个div放在同一个父元素中，并使用height和line-height属性来垂直对齐，要保证height和line-height的值相等：

<div style="height: 300px; line-height: 300px;">
  <div>Div 1</div>
  <div>Div 2</div>
</div>

以上就是如何让两个div对齐的方法了。可以根据具体情况选择使用哪种方法来实现对齐效果。

css 教程

一个月内的热帖推荐

Lv.1普通用户

62845 帖子	12 小组	80 积分

帖子

小组

积分

关注作者

发帖	回复	分享

本组热帖