layui-table 樣式


<!DOCTYPE html>
<html>

<head>
    <style>
        #lay-table {
            background-color: #fff;
            color: #666;
            border-collapse: collapse;
            border-spacing: 0;
        }

        #lay-table td {
            border-width: 1px;
            border-style: solid;
            border-color: #e6e6e6;
        }
    </style>

<body>
    <table id="lay-table">
        <tr>
            <td>0001</td>
            <td>0002</td>
            <td>0003</td>
            <td>0004</td>
            <td>0005</td>
        </tr>
    </table>
</body>
</head>

</html>

 

 

 

<!DOCTYPE html>
<html>

<head>
    <style>
        #lay-table {
            background-color: #fff;
            color: #666;
            border-collapse: collapse;
            border-spacing: 0;
            margin: 0 auto;
            margin-top: 20px;
        }

        #lay-table td {
            border-width: 2px;
            border-style: solid;
            border-color: #666;
            padding: 20px;
        }
    </style>

<body>


    <table id="lay-table001" style="display:none;">
        <tr>
            <td>到訪時間</td>
            <td colspan="3">
                2020-01-02 10:60:60
            </td>
        </tr>
        <tr>
            <td>來賓姓名</td>
            <td>張寶珠</td>
            <td>聯系電話</td>
            <td>1233313313313</td>
        </tr>
        <tr>
            <td>身份證號</td>
            <td colspan="3">
                41100001555588888664465
            </td>
        </tr>
        <tr>
            <td>來賓單位</td>
            <td>xxx科技公司</td>
            <td>來賓人數</td>
            <td>100</td>
        </tr>
        <tr>
            <td>訪問部門</td>
            <td>技術部</td>
            <td>被訪問人</td>
            <td>張小東</td>
        </tr>
        <tr>
            <td>攜帶物品</td>
            <td colspan="3">15箱A4打印機;</td>
        </tr>
        <tr>
            <td>事由</td>
            <td colspan="3">因啥啥啥,或者公司集體組織參觀活動等等</td>
        </tr>
    </table>

    <div>
            <div style="text-align: center;margin-top: 50px;"><span style="font-size: 20px;font-weight: 600;">來訪單</span></div>
            <table id="lay-table"><tr><td>到訪時間</td><td colspan="3">2020-01-02 10:60:60</td></tr>
                <tr><td>來賓姓名</td><td>張寶珠</td><td>聯系電話</td><td>1233313313313</td></tr>
                <tr><td>身份證號</td><td colspan="3">4110231555588888664465</td></tr>
                <tr><td>來賓單位</td><td>xxx科技公司</td><td>來賓人數</td><td>100</td></tr>
                <tr><td>訪問部門</td><td>技術部</td><td>被訪問人</td><td>張小東</td></tr>
                <tr><td>攜帶物品</td><td colspan="3">15箱A4打印機;</td></tr>
                <tr><td>事由</td><td colspan="3">因啥啥啥,或者公司集體組織參觀活動等等</td></tr></table>
    </div>
  

<script src="MyStringBuilderHanbleHelper.min.js"></script>
    <script>
        //獲取值得方法1
            var model = {};
            var inputs = document.getElementsByTagName('input'); // 獲取input集合
            for (var i = 0; i < inputs.length; i++) {
                if (inputs[i].name.length > 0) {
                    model[inputs[i].name] = inputs[i].value;
                }
            }

        var model = {};
        model["Phone"] = "1233313313313";
        model["time"] = "2020-01-02 10:60:60";
        model["VisitorName"] = "來賓姓名";
        model["CardID"] = "1233211234567";
        model["Unit"] = "來賓單位";
        model["VisitedDepart"] = "訪問部門";
        model["VisitedName"] = "被訪問人";
        model["Matter"] = "請假事由!!!";
        model["Valuable"] = "攜帶物品";
        model["Num"] = "來賓人數";

    var sb = new HandleHelper.MyStringBuilder();
    sb.appendFormat('<div>');
    sb.appendFormat('<div style="text-align: center;margin-top: 50px;"><span style="font-size: 20px;font-weight: 600;">來訪單</span></div>');
    sb.appendFormat('<table id="lay-table"><tr><td>到訪時間</td><td colspan="3">{0}</td></tr>',model.Phone);
    sb.appendFormat('<tr><td>來賓姓名</td><td>{0}</td><td>聯系電話</td><td>{1}</td></tr>',model.VisitorName,model.Phone);
    sb.appendFormat('<tr><td>身份證號</td><td colspan="3">{0}</td></tr>',model.CardID);
    sb.appendFormat("<tr><td>來賓單位</td><td>{0}</td><td>來賓人數</td><td>{1}</td></tr>",model.Unit,model.Num);
    sb.appendFormat("<tr><td>訪問部門</td><td>{0}</td><td>被訪問人</td><td>{1}</td></tr>",model.VisitedDepart,model.VisitedName);
    sb.appendFormat('<tr><td>攜帶物品</td><td colspan="3">{0}</td></tr>',model.Valuable);
    sb.appendFormat('<tr><td>事由</td><td colspan="3">{0}</td></tr></table>',model.Matter);
    sb.appendFormat('</div>');
    document.body.innerHTML = sb.toString();
    //window.print();

    </script>
</body>
</head>

</html>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM