<html> <head> <meta charset="UTF-8"/> <title>div中宽高度自适应文字换行居中demo</title> </head> <style type="text/css"> .fatherbox{ width: 200px; height: 300px; text-align: center; /* start 以下为样式内容，不重要*/ border: 1px solid red; background: green; /* end 以上为样式内容，不重要*/ } .childbox1{ display: inline-block; vertical-align: middle; /* start 以下为样式内容，不重要*/ background: blue; color: #fff; padding: 10px; /* end 以上为样式内容，不重要*/ } .childbox2{ display: inline-block; vertical-align: middle; height: 100%; } </style> <body> <div class="fatherbox"> <div class="childbox1"> 我是居中内容1<br/> 我是居中内容1<br/> 我是居中内容1<br/> 我是居中内容1 </div> <div class="childbox2"></div> </div> </body> </html>
div中宽高度自适应文字换行居中demo实现
原文出自：https://www.iteye.com/blog/fp-moon-1150774
原文：https://www.cnblogs.com/xiaojianwei/p/11927121.html