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>
  • 相关阅读:
    3.18日
    线程的面试题
    关于instanceof测试遇到的问题
    spring
    自动登录代码
    Filter
    多态
    基于HTML,css,jQuery,JavaScript,MySQL搭建博客系统
    基于bootstrap+MySQL搭建动态网站
    基于bootstrap_网站汇总页面
  • 原文地址:https://www.cnblogs.com/famLiu/p/7509103.html
Copyright © 2011-2022 走看看