<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>无标题文档</title> <style type="text/css"> *{ margin:0; padding:0;} .fl{ float:left; width:100px; height:100px; background:green} .nofl{ width:300px; height:300px; background:red; margin:100px auto; position:relative; overflow:hidden;} .nofl p{ position:absolute; left:50%; top:50%;} .nofl p img{ position:absolute; left:-50%; top:-50%;} .nofl p .hide{ position:static; visibility:hidden;} </style> </head> <body> <div class="nofl"> <p> <img src="02.png" class="hide" /> <a href="#"><img src="02.png" /></a> </p> </div> </body> </html>
实际效果如下: