温馨提示×

css设置div居中的方法有哪些

小亿
87
2023-07-19 17:45:01
栏目: 编程语言

  1. 使用margin属性设置左右外边距为auto,上下外边距为0。
div {
margin: 0 auto;
}
  1. 使用flex布局,将父元素的display属性设置为flex,然后使用justify-content和align-items属性将子元素居中。
div {
display: flex;
justify-content: center;
align-items: center;
}
  1. 使用absolute定位,将左右外边距设置为auto,上下外边距设置为0,然后将left和right属性设置为0,将top和bottom属性设置为0。
div {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
  1. 使用grid布局,将父元素的display属性设置为grid,然后使用justify-items和align-items属性将子元素居中。
div {
display: grid;
justify-items: center;
align-items: center;
}

0