• 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>
    

      

  • 相关阅读:
    lambda表达式
    PAT 1071. Speech Patterns
    PAT 1070. Mooncake
    1069. The Black Hole of Numbers
    PAT 1068. Find More Coins
    背包问题(动态规划)
    PAT 1067. Sort with Swap(0,*)
    PAT 1066. Root of AVL Tree
    PAT 1065. A+B and C
    PAT 1064. Complete Binary Search Tree
  • 原文地址:https://www.cnblogs.com/tonnytong/p/8028829.html
Copyright © 2020-2023  润新知