zoukankan      html  css  js  c++  java
  • 使用flex布局(多行,一行三个),换行后最后一行左右对齐问题

    <html>
    
    <head>
        <style>
            html,
            body,
            ul {
                margin: 0;
                padding: 0;
            }
    
            ul {
                width: 100%;
                height: 40rem;
                background: #000;
                display: flex;
                flex-wrap: wrap;
                justify-content: space-between;
            }
    
            li {
                width: 30%;
                height: 6rem;
                display: inline-block;
                background: #ededee;
                margin-top: 1rem;
                text-align: center;
            }
    
            ul:after {
                content: "";
                width: 30%;
                height: 0px;
                visibility: hidden;
            }
        </style>
    </head>
    
    <body>
        <ul>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
            <li>1</li>
        </ul>
    </body>
    
    </html>

    *重点在给外层的盒子加after

  • 相关阅读:
    安装Hive2及配置HiveSever2
    sqoop语句
    Sqoop配置
    IO流的概述
    List集合的简单使用
    包装类
    访问权限修饰符
    接口
    抽象类
    final关键字
  • 原文地址:https://www.cnblogs.com/fanqiuzhuji/p/13902553.html
Copyright © 2011-2022 走看看