zoukankan      html  css  js  c++  java
  • flex 布局的页面

    <!DOCTYPE html>
    <html>
    <head>
    <title>横向滑动</title>
    <style type="text/css">
    .flex-row-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    }

    .flex-row {
    display: flex;
    flex-direction: row;
    }

    .form-row {
    height: 30px;
    line-height: 30px;
    margin-bottom: 12px;
    }

    .form-row label {
    min- 120px;
    text-align: right;
    }

    .form-row input{
    150px;
    margin-left: 15px;
    }
    </style>
    </head>
    <body>
    <div class="flex-row-wrap">
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    <div class="form-row flex-row">
    <label for="">哈哈哈:</label>
    <input type="text">
    </div>
    </div>
    </body>
    </html>

  • 相关阅读:
    selenium之 关闭窗口close与quit
    如何去掉xmind的备注红色下划线
    cmd里面快速粘贴复制的设置方式以及初始位置设置
    Python中的空格和缩进问题总结
    python 单例实现
    logging 简单使用
    CTypes
    类装饰器使用
    Django admin
    Django 视图
  • 原文地址:https://www.cnblogs.com/fdbk/p/12893412.html
Copyright © 2011-2022 走看看