提示:您可以先修改部分代碼再運行
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <title>demo</title> <style type="text/css"> .box { position: relative; width: 500px; height: 300px; border: 1px solid #FFF; background-color: #999; display: table; } .wrap{ display: table-cell; vertical-align: middle; *position:absolute; *top: 50%; *left: 0; } .content { *position: relative; *top: -50%; *left: 0; } </style> </head> <body> <div class="box"> <div class="wrap"> <p class="content"> 我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行 固定寬度的文字自動換行並垂直劇中">固定寬度的文字自動換行並垂直劇中 </p> </div> </div> <div class="box"> <div class="wrap"> <p class="content"> 是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行我是文字隨便幾行 </p> </div> </div> </body></html></td> </tr></table>
提示:您可以先修改部分代碼再運行