master

分支 (1)

管理

管理

master

bs
/
bs-row-col.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>simple</title>
    <link rel="stylesheet" href="./css/bootstrap.css" />
    <script src="./js/bootstrap.bundle.js"></script>
    <link rel="stylesheet" href="./css/bs-slide.css" />
</head>

<>
    <!-- <div class="row" style="border: solid 2px rebeccapurple ; width: 800px;">
        <div class="col-2" style="background-color: aquamarine;">
            <div style="margin-left: 20px;">
                <label for="username">姓名</label>
            </div>
        </div>
        <div class="col-8" style="background-color: royalblue;">
            <input class="form-control" type="text" id="username" value="" />
        </div>
    </div> -->
    <div>-------------请假单------------</div>
    <form style="width: 800px" class="container">
        <div class="row">
            <div class="col-2 align-self-center">
                <div style="margin-left: 20px;">
                    <label for="applier">请假人</label>
                </div>
            </div>
            <div class="col-6">
                <input class="form-control" type="text" id="applier" value="" />
            </div>
        </div>
        <div class="row">
            <div class="col-2 align-self-center">
                <div style="margin-left: 20px;">
                    <label for="leaveTime">请假时间</label>
                </div>
            </div>

            <div class="col-6 align-self-center">
                <div class="input-group">
                    <input type="number" class="form-control" id="leaveTime" value="1" />
                    <div class="input-group-text">天</div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-2 align-self-center">
                <div style="margin-left: 20px">
                    <label for="leaveType">请假类型</label>
                </div>
            </div>
            <div class="col-6">
                <select id="leaveType" class="form-select">
                    <option>病假</option>
                    <option>年假</option>
                </select>
            </div>
        </div>
        <div class="row">
            <div class="col-2 align-self-center">
                <div style="margin-left: 20px">
                    <label for="leaveType">请假事由</label>
                </div>
            </div>
            <div class="col-6">
                <textarea class="form-control" rows="2"></textarea>
            </div>
        </div>
        <div class="row" style="margin-top: 80px">
            <div class="col-2 offset-2">
                <button class="btn btn-primary">重置</button>
            </div>
            <div class="col-4 offset-1">
                <button class="btn btn-warning">提交</button>
            </div>
        </div>

    </form>


</body>

</html>