作业

<!DOCTYPE html> 
<html lang="en"> 
<head> <meta charset="UTF-8">
<title></title> 
      <style type="text/css">
         *{margin:0;
           padding: 0;
             }
        .box{
            width: 500px;
            height: 42px;
            border:1px #818181 solid ;
            background-color: white;
            margin: 0 auto;
            margin-top: 50px;
           }
        .box1,.box2,.box3,.box4,.box5,.box6,.box7,.box8,.box9,.box10{
             float:left;
            margin-left: 4px;
           }
       .box1,.box2,.box3,.box4,.box5,.box6,.box7,.box8,.box9,.box10 box{
            text-decoration: none;
            color:black;
            font-size: 12px;
          }
       .box1,.box2,.box3,.box4,.box5,.box6,.box7,.box8,.box9,.box10{
             width: 25px;
             background-color: gold;
             padding:5px 10px;
             margin-top: 7px;
            text-align: center;
          }
     .box1:hover{
         background-color:red;
        }
     .box2:hover{
         background-color:red;
         }
     .box3:hover{
         background-color:red;
         }
     .box4:hover{
         background-color:red;
       }
     .box5:hover{
         background-color:red;
        }
    .box6:hover{
        background-color:red;
      }
    .box7:hover{
         background-color:red;
       }
    .box8:hover{
        background-color:red;
      }
    .box9:hover{
        background-color:red;
      }
    .box10:hover{
       background-color:red;
    }
    .box1 a:hover{
       color:white;
       }
    .box2 a:hover{
       color:white;
    }
    .box3 a:hover{
       color:white;
     }
     .box4 a:hover{
         color:white;
      }
   .box5 a:hover{
      color:white;
     }
   .box6 a:hover{
      color:white;
      }
   .box7 a:hover{
       color:white;
     }
   .box8 a:hover{
      color:white;
     }
   .box9 a:hover{
      color:white;
     }
   .box10 a:hover{
      color:white;
  }
      </style>
</head>
<body> 
     <div class="box">
         <div class="box1"><a href="#">1</a></div> 
         <div class="box2"><a href="#">2</a></div> 
         <div class="box3"><a href="#">3</a></div>
         <div class="box4"><a href="#">4</a></div>
         <div class="box5"><a href="#">5</a></div> 
         <div class="box6"><a href="#">...</a></div>
         <div class="box7"><a href="#">9</a></div> 
         <div class="box8"><a href="#">10</a></div>
         <div class="box9"><a href="#">11</a></div>
         <div class="box10"><a href="#">12</a></div>
     </div> 
</body>
</html>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容