1. <style>
    2.     li{
    3.         float: left;
    4.         width: 30px;
    5.         height: 30px;
    6.         text-align: center;
    7.         border: 1px solid green;
    8.         list-style: none;
    9.         border-radius: 50%;
    10.         margin: 10px;
    11.         line-height: 30px;
    12.         transition: all .4s;
    13.         /* 鼠标经过变小手 */
    14.         cursor: pointer;
    15.     }
    16.     li:hover{
    17.         transform: scale(1.2);
    18.     }
    19. </style>
    20. <body>
    21. <ul>
    22.     <li>1</li>
    23.     <li>2</li>
    24.     <li>3</li>
    25.     <li>4</li>
    26.     <li>5</li>
    27.     <li>6</li>
    28.     <li>7</li>
    29. </ul>
    30. </body>

    image.png
    转换综合写法顺序
    image.png