<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>图片水平垂直居中</title> <style type="text/css"> .warp{ width: 600px; height: 600px; width: 0 auto; border: 1px solid; text-align: center; } .warp:after{ content: ""; display: inline-block; height: 100%; vertical-align: middle; } .warp img{ vertical-align: middle; } </style> </head> <body> <div class="warp"> <img src="img/logo.png" /> </div> </body> </html>
原文:https://www.cnblogs.com/yitiansanchangyu/p/12318008.html