给所有div加上边框=10px之后，再给所有div设置margin-left与margin-top;以及浮动（float:left）
因此时需要鼠标悬停效果：所以设置给div设置伪类:hover,然因浮动脱离了标准流。所以覆盖了div的边框,所以鼠标悬停时div边框显示不全设置定位（position:releative;）之后；
经测验：在html中的层级关系为；标准流<浮动流<定位；所以现在鼠标悬停时div所有的边框都会显示，可以模仿淘宝案例等；
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ width: 400px; height: 200px; border:10px solid #ccc; float: left; margin-left: -10px; margin-top:-10px; } div:hover{ border-color: red; position: relative; } .content{ width: 1620px; height: 600px; padding: 20px; border:none;} </style> </head> <body> <div class="content"> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> </body> </html>