HTML表格简单实用

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <title>债权出让规则</title>
        <style type="text/css">
            #div1 {
                margin-bottom: 0.5rem;
                font-family: verdana, arial, sans-serif;
                font-size: 15px;
            }
            #p1 {
                font-family: verdana, arial, sans-serif;
                font-size: 15px;
                margin-bottom: 0.2rem;
            }
            #p2 {
                font-family: verdana, arial, sans-serif;
                font-size: 13px;
                margin-top: 0.2rem;
            }
            #p3 {
                font-family: verdana, arial, sans-serif;
                font-size: 15px;
                margin-bottom: 0.1rem;
            }
            #p4 {
                font-family: verdana, arial, sans-serif;
                font-size: 13px;
                margin-top: 0.2rem;
            }
            table.tableData {
                /*font-family 规定元素的字体系列。font-family 可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体,则会尝试下一个*/
                /*常用的字体组合  http://www.w3school.com.cn/cssref/css_websafe_fonts.asp*/
                font-family: verdana, arial, sans-serif;
                font-size: 11px;
                color: #333333;
                border-width: 1px;
                border-color: #666666;
                border-collapse: collapse;/*为表格设置合并边框模型*/
                width: 100%;
                text-align: center;
            }
            table.tableData td {
                border-width: 1px;
                padding: 8px;
                border-style: solid;/* 所有 4 个边框都是实线*/
                border-color: #666666;
                background-color: #ffffff;
                width: 50%;
            }
        </style>
    </head>
    <body>
        <div id="div1">
            <p id="p1">债权出让规则: </p>
            <p id="p2">
                1、出借的四方化缘项目在计息30(含)个自然日后可发起债权出让;
                <br/> 2、每次债权出让认购时间为3个自然日;
                <br/> 3、债权还息日的前3个自然日不可出让;
                <br/> 4、债权可部分出让,最低可出让1份;
                <br/> 5、出借的每一个四方化缘项目在每个自然月仅可债权出让一次,若债权出让失败或取消(出让的债权份额为0),当自然月可继续出让;
                <br/> 6、逾期项目不得出让。
            </p>
        </div>
        <div id="div2">
            <p id="p3">债权出让收费规则:</p>
            <p id="p4"> 出让人债权出让成功后,平台会向出让人收取一定比例的出让服务费。
                <br/> 出让服务费 = 实际出让金额*出让服务费率
            </p>
            <table class="tableData">
                <tr>
                    <td>持有天数</td>
                    <td>出让服务费率</td>
                </tr>
                <tr>
                    <td>≤90天</td>
                    <td>2%</td>
                </tr>
                <tr>
                    <td>>90天</td>
                    <td>0.5%</td>
                </tr>
            </table>
        </div>
    </body>
</html>

posted @ 2017-08-10 15:32  零度咖啡  阅读(96)  评论(0)    收藏  举报