Fork me on GitHub

九宫图Css 

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <title>css实现九宫格</title>
        <style type="text/css">
            .box{width:333px;}
            .box div{
                width:100px;height:100px;border:3px solid blue;float:left;background: green;
                margin-left:-3px;
                margin-top:-3px;
            }
            .box div:hover{
                position: relative;
                border-color:red;
                z-index: 100;
            }
        </style>
    </head>

    <body>
        <div id="wrap">
            <div class="box">
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
                <div></div>
            </div>
        </div>
    </body>

</html>
　　
　　

 

posted @ 2018-01-04 05:58  森海轮回  阅读(256)  评论(0)    收藏  举报