<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>img在div中上下居中</title> <style type="text/css"> .box{ line-height: 56px; display:table; text-align:center; } .box span{ display:table-cell; vertical-align:middle; } </style> </head> <body> <div class="box"> <span><img src="notice.png" alt="" /></span> 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 我是文字我是文字我是文字我是文字我是文字 </div> </body> </html>