让div里面的div居中（怎样让一个div中div水平居中）
本文目录
怎样让一个div中div水平居中
《div style="width:200px; height:150px; background:red; padding-top:50px;"》
《div style="width:100px; height:100px; background:white; margin:0px auto"》《/div》
《/div》有一点要注意，内部标签加margin:0px
auto即可水平居中，但是标签必须设置宽度才有效，如果内部标签需要自动伸展宽度又要水平居中，那么div不太好办到，不妨使用table来实现，举例如下：
《div style="width:200px; height:150px; background:red; padding-top:50px;"》
《table border="0" cellpadding="0" cellspacing="0" style="margin:0px auto"》
《tr》
《td style="height:100px; background:white;"》11111《/td》
《/tr》
《/table》
《/div》
div上下居中怎么设置
第一种方式，知道自己高度，知道容器高度，用margin-top,margin-left设置居中。
第二种方式，知道自己高度，知道容器高度，设置成position:relative;用margin:0 auto;实现左右居中，用margin-top实现上下居中。
第三种方式；position:absolute;的情况，用top，left，bottom，right距离来设置居中，前提也是知道容器高度和自己高度。
第四种方式，用弹性容器来居中。这种情况一般是不自动换行，只有一行的居中情况。
display:flex;display:-webkit-flex;/*纵向对齐方式：居中*/align-content:center;-webkit-align-content:center;
div中嵌套div，怎样才能让里面的div居中显示
正确的也是对页面构造没有影响的设置如下:
1、对需要水平居中的DIV层添加以下属性:
margin-left: auto;
margin-right: auto;
2、主要的样式定义如下：
body {TEXT-ALIGN: center;}
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }
怎么让div中的div上下居中
方法一：
《div style="width:100px;height:200px;background-color:yellow;line-height:200px;position:relative"》
《div style="width:50px;height:50px;background-color:#ff6600;margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0; "》
《/div》
《/div》
方法二：用table布局(不喜欢用 不写了)
方法三：我最喜欢的方法，直接用给爸爸加padding控制垂直方向的距离
《div style="width:100px;background-color:yellow;padding:50px 0"》
《div style="width:50px;height:50px;background-color:#ff6600; "》
《/div》
《/div》
更多文章：
2026年10月11日 05:30
跷二郎腿太低好吗？想要通过贴墙站改正二郎腿影响的话，有哪些要点需要注意
2026年10月11日 05:10
易语言点击js按钮（易语言网页填表怎样点击链接为“javascript:void（0）“的按钮）
2026年10月11日 03:00
2026年10月11日 01:10
2026年10月11日 01:00
compare with造句（用compared with和compared to造句）
2026年10月10日 23:30
2026年10月10日 22:50
tensorflow与keras对应版本（为什么tensorflow2.8没有keras）
2026年10月10日 22:10
2026年10月10日 22:00
maven仓库jar网站（如何在maven仓库中添加jar包）
2026年10月10日 19:50
