<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style> #div1 { border:1px red solid; width: 100%; height: 570px; min-width: 1200px; } #div2 { border: 1px red solid; position: absolute; left: 50%; top: 285px; margin-left: -300px; background: url('/home/tpl/pc/img/bg1.png') repeat; width: 640px; padding-top: 20px; padding-bottom: 20px; padding-left: 40px; padding-right: 40px; border-radius: 8px; } </style></head><body> <div id="div1" > <div id="div2" > </div> </div> </body></html>div2的宽和高都不能写死啊，div2的宽和高是根据它的内容动态变化的，div2的最大宽度等于div1的宽度，你都写死了，不行
<!doctype html><html lang="en"><head> <meta charset="UTF-8" /> <title> 页面名称 </title><style type="text/css">#div0 { display:table; width: 100%; min-height:735px;}#div1 { display:table-cell; vertical-align:middle; text-align:center; background-color: #999999;}#div2 { display:inline-block; text-align:center; background-color: #FFCCFF;}</style></head><body><div id="div0"><div id="div1"> <div id="div2"> <p>ggggggggggggggggggggggggggggggggggg</p> <p>ggggggggggggggggggggggggggggggggggg</p> <p>ggggggggggggggggggggggggggggggggggg</p> <p>ggggggggggggggggggggggggggggggggggg</p> </div></div></div></body></html>就是这效果，谢了
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
