发表于: 2021-02-09 15:22:25

1 1277


重新开始....换一种方式写九宫格,提交任务一

nginx访问:http://www.linzeyuzheng.cn/xiuzhen/task1/nine.html

 <!DOCTYPE html>
 <html lang="en">
 
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>九宫格</title>
     <link rel="stylesheet" href="../css/common.css" />
 
     <style type="text/css">
         .mav div {
             display: inline-block;
             /* 正方形 */
             width: 31%;
             height: 31vw;
             background-color: orange;
             margin-left: 1.1%;
             margin-right: 0.5%;
             margin-top: 1%;
         }
     </style>
 </head>
 
 <body>
     <div class="mav">
         <div></div>
         <div></div>
         <div></div>
     </div>
 
     <div class="mav">
         <div></div>
         <div></div>
         <div></div>
     </div>
 
     <div class="mav">
         <div></div>
         <div></div>
         <div></div>
     </div>
 
 
 </body>
 
 </html>


效果如下


返回列表 返回列表
评论

    分享到