Javascript 如何使DIV中的内容垂直对齐 ABCUUU

我只是想找到一些方法，在

div\content

的中间垂直对齐。实际上我有一些解决办法。第一个是使用

行高

，但是如果

div#content

中有另一个

div

，则它无法工作。和

verticalalign:middle

我想这对桌子合适吗？还有其他可用的解决方案吗

我尝试了垂直对齐：中间和显示：表格单元格，另一个问题出现了， 宽度不能工作，我给那个div一个大的宽度，它可以填充屏幕（1438px），但现在宽度也是那个数字，但只填充屏幕的1/3宽度。

---

表格单元格看起来像是在屏幕上创建每个单元格，但我只想为它们指定表格单元格的长度。

在元素上声明了

display:table cell

，垂直对齐就可以了

#内容{
显示：表格单元格；
垂直对齐：中间对齐
}

使用元素上声明的

显示：表格单元格

，垂直对齐将起作用

#内容{
显示：表格单元格；
垂直对齐：中间对齐
}

根据您的需要使用此选项

<div id="content">ABC<div>UUU</div></div>

---

根据您的需要使用此选项

<div id="content">ABC<div>UUU</div></div>

---

请参见

中有关正常和内联div垂直对齐的详细说明参见

中有关正常和内联div垂直对齐的详细说明，使用

显示：表格单元格阐述其他答案；垂直对齐：中间

。。。表格单元格不能具有100%宽度，但其容器可以

使用CSS表 具有表格显示的项目接受动态宽度：

#content {display:table-cell; vertical-align:middle}

例如，使用示例HTML：

#existingContainer {
    display: table;
    width: 100%;
}
#content {
    display: table-cell;
    vertical-align: middle;
    height: 100px; /* example */
}

---

使用

display:表格单元格解释其他答案；垂直对齐：中间

。。。表格单元格不能具有100%宽度，但其容器可以

使用CSS表 具有表格显示的项目接受动态宽度：

#content {display:table-cell; vertical-align:middle}

例如，使用示例HTML：

#existingContainer {
    display: table;
    width: 100%;
}
#content {
    display: table-cell;
    vertical-align: middle;
    height: 100px; /* example */
}

---

这将删除

div

s块属性。例如，你不能再定义宽度了。@Abody97这是真的，但不是问题的一部分，关于你的第一条评论，括号表示法是一种常用的占位符声明方法，通常在占位符不重要或定义不够清楚的情况下。这就去掉了

div

s块属性。例如，你不能再定义宽度了。@Abody97这是真的，但不是问题的一部分，关于你的第一条评论，括号表示法是声明占位符的常用方法，大多数情况下，它不重要或定义不够清楚。@juggernaut:谢谢，很高兴我能这么做help@juggernaut：谢谢，很高兴我能帮忙