zoukankan      html  css  js  c++  java
  • 51.关于display属性的一点点总结,看代码

    CSS

    .display{
                    border: 1px solid;
                    margin-bottom: 3px;
                }
                
                .inline-block{
                    display: inline-block;
                    height: 100px;padding: 10px;
                    padding: 10px;margin: 10px;
                    margin-top: 20px;
                }
                .inline{
                    display: inline;
                    height: 100px;padding: 10px;margin: 10px;
                }
                .table{
                    display: table;
                    border: none;
                    border-top: 1px solid;
                    border-left: 1px solid;
                }
                .header-group{
                    display: table-header-group;
                }
                .row-group{
                    background: #EEEEEE;
                    display: table-row-group;
                }
                
                .cell{
                    width: 88px;
                    display: table-cell;
                    padding: 3px 15px;
                    border-bottom: 1px solid;
                    border-right: 1px solid;
                    text-align: center;
                    color: #777777;
                    font-family: arial;
                    font-size: 20px;
                }

    HTML

    <div class="display inline-block">
                inline-block
            </div>
            <div class="display inline">
                block
            </div>
            <div class="display block">
                block
            </div>
            <div class="display table">
                <div class="header-group">
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                </div>
                <div class="row-group">
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                    <div class="cell">  cell</div>
                </div>
                
            </div>
  • 相关阅读:
    JVM工作原理--垃圾收集
    并发编程之单例模式
    设计模式之动态代理
    UML类图基础
    CAP理论的理解
    Dubbo RPC调用参数校验---错误message自动返回
    ELK日志分析系统搭建
    Kafka原理及应用(一)
    HTTPS的原理
    Maven 生命周期的概念(指令默认顺序执行)
  • 原文地址:https://www.cnblogs.com/famLiu/p/7509103.html
Copyright © 2011-2022 走看看