美文网首页
word文档式HTML表格

word文档式HTML表格

作者: 领主芭芭拉 | 来源:发表于2019-10-28 15:26 被阅读0次
需求.png

用html呈现如图表格,合并单元格太繁琐

HTML

<div style="font-size:24px;text-align: center;line-height: 50px;margin-bottom: 20px;">个体工商户开业登记申请书</div>
    <table cellpadding="0" cellspacing="0" class="auto-style1" border="1">
        <tr>
            <td rowspan="7">经营者</td>
            <td>
                姓名
            </td>
            <td><input type="text" /></td>
            <td>
                性别
            </td>
            <td><input type="text" /></td>
            <td rowspan="7" style="min-width:150px;">
                照片粘贴处
            </td>
        </tr>
        <tr>
            <td>
                身份证
            </td>
            <td colspan="2"><input type="text" /></td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>
                住所
            </td>
            <td colspan="2"><input type="text" /></td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td>

                邮政编码
            </td>
            <td><input type="text" /></td>
            <td>
                移动电话
            </td>
            <td><input type="text" /></td>
        </tr>
        <tr>
            <td>
                固定电话
            </td>
            <td><input type="text" /></td>
            <td>
                电子邮箱
            </td>
            <td><input type="text" /></td>
        </tr>
        <tr>
            <td>
                政治面貌
            </td>
            <td><input type="text" /></td>
            <td>
                民族
            </td>
            <td><input type="text" /></td>
        </tr>
        <tr>
            <td>
                文化程度
            </td>
            <td><input type="text" /></td>
            <td>
                职业状况
            </td>
            <td><input type="text" /></td>
        </tr>
        <tr>
            <td>
                名称
            </td>
            <td colspan="5"><input type="text" /></td>
        </tr>
        <tr>
            <td rowspan="2">
                备选字号(请选用不同字号)
            </td>
            <td colspan="5">1<input type="text" /></td>
        </tr>
        <tr>
            <td colspan="5">2<input type="text" /></td>
        </tr>
        <tr>
            <td rowspan="7">
                组成形式
            </td>
            <td colspan="5">
                个人经营 家庭经营

            </td>
        </tr>
        <tr>
            <td rowspan="6">参加经营的家庭成员</td>
            <td><input type="text" /></td>
            <td rowspan="6">参加经营的家庭成员身份证号码</td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td><input type="text" /></td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td><input type="text" /></td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td><input type="text" /></td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td><input type="text" /></td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td><input type="text" /></td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td>经营范围</td>
            <td colspan="5"><input type="text" /></td>
        </tr>
        <tr>
            <td rowspan="2">经营场所</td>
            <td>地址</td>
            <td colspan="4"><input type="text" /></td>
        </tr>
        <tr>
            <td>邮政编码</td>
            <td><input type="text" /></td>
            <td>联系电话</td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td>从业人数</td>
            <td colspan="2"><input type="text" /></td>
            <td>资金数额</td>
            <td colspan="2"><input type="text" /></td>
        </tr>
        <tr>
            <td colspan="6">

                本人依照《个体工商户条例》申请登记为个体工商户,提交文件材料真实有效。仅对真实性承担责任<br />
                <div style="text-align: right;line-height:30px;">经营者签名:<input style="width:80px;" type="text" /><br />
                 <input style="width: 60px;" type="text" />年<input style="width: 60px;" type="text" />月<input style="width: 60px;" type="text" />日</div>
              
            </td>
        </tr>
    </table>

CSS

body{
        padding: 20px 100px;
    }
    table{
        color:#333;
        border: 1px solid #ddd;
    }
    table td{
        padding: 5px 3px;
    }
    table input{
        border: 0;
    }
最终效果: 效果.png

一般写这种页面都是要导出 word 的功能

附上: 导出.png

链接:https://blog.csdn.net/sD7O95O/article/details/100643428

相关文章

网友评论

      本文标题:word文档式HTML表格

      本文链接:https://www.haomeiwen.com/subject/qpvhrctx.html