zoukankan      html  css  js  c++  java
  • display inline-block 间隔

    1.如果li横排用display:inline-block; 则li之间不能有间隔 必须连着一起,所以才一般用float:left;

    .today-wrap{
      position: relative;
      background: $white;
      height: 220px;
      padding-top: 40px;
      padding-bottom:40px;
      li{
        float: left;
         50%;
        &:last-child{
          &:before{
            content: '';
            position: absolute;
            left:50%;
             1px;
            height: 80%;
            top:20px;
            background:$grey;
          }
        }
      }
      .today-recommend{
        text-align: center;
        color: $blue;
        .recommend-num{
          font-size: 56px;
        }
        .recommend-unit{
          font-size: 24px;
        }
        .recommend-name{
          font-size: 26px;
          color:$grey;
        }
      }
    
    }
    

      

    <div class="today-wrap">
            <ul>
                <li class="today-recommend">
                    <a href="#">
                        <div>
                            <span class="recommend-num">32</span>
                            <span class="recommend-unit">笔</span>
                        </div>
                        <div class="recommend-name">
                            今日推广订单
                        </div>
                    </a>
                </li>
                <li class="today-recommend">
                    <a href="#">
                        <div>
                            <span class="recommend-num">260.00</span>
                            <span class="recommend-unit">元</span>
                        </div>
                        <div class="recommend-name">
                            今日获得收益
                        </div>
                    </a>
                </li>
            </ul>
    
        </div>
    

      

  • 相关阅读:
    奇怪的人
    假象世界
    心态记录
    民用自组织网络公司概要
    禁止VMware虚拟机与Host的时间同步
    20万左右SUV介绍
    手机GPS为什么能在室内定位?
    取余与位运算
    shell 基础进阶 *金字塔
    shell 、awk两种方法编写9*9法表
  • 原文地址:https://www.cnblogs.com/tonnytong/p/8028829.html
Copyright © 2011-2022 走看看