美文网首页
html画出一张带有不规则表格的A4纸

html画出一张带有不规则表格的A4纸

作者: 5df463a52098 | 来源:发表于2018-07-25 10:48 被阅读266次

如何画出一张带有表格的A4纸:


image.png

html:

<div class="page">
    <table border="1">
        <tr class="tr-1">
            <td><div>单位名称</div></td>
            <td>
                <div class="input"></div>
            </td>
            <td><div>统一社会信用代码</div></td>
            <td>
                <div class="input"></div>
            </td>
        </tr>
        <tr class="tr-2">
            <td colspan="1"><div>吊销范围</div></td>
            <td colspan="9">
                <div>

                </div>
            </td>
        </tr>
        <tr class="tr-3">
            <td colspan="1"><div>吊销原因</div></td>
            <td colspan="9">
                <div>

                </div>
            </td>
        </tr>
        <tr class="tr-4">
            <td colspan="1" rowspan="4"><div>吊销来源</div></td>
            <td colspan="9" rowspan="4">
                <div class="check-box">
                </div>
            </td>
        </tr>
    </table>
</div>

css:

  .page {
            width: 21cm;
            min-height: 29.7cm;
            padding: 2cm;
            margin: 1cm auto;
            border: 1px #D3D3D3 solid;
            border-radius: 5px;
            background: white;
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            position: relative;
        }

        @page {
            size: A4;
            margin: 0;
        }
        @media print {
            .page {
                margin: 0;
                border: initial;
                border-radius: initial;
                width: initial;
                min-height: initial;
                box-shadow: initial;
                background: initial;
                page-break-after: always;
            }
        }
        table{
            border-collapse: collapse; /*去掉双重的border*/
            width: 21cm;
            height: 29.7cm;
            font-size: 14px;
            text-align: center;
        }
        table tr:nth-child(1) td{
            width: 25%;
        }

A4的大小:21cm*29.7cm(width:794px;)。
单位换算:1 inch = 2.54 cm 1mm = 96 px 1 cm = 37.79528 px

相关文章

  • html画出一张带有不规则表格的A4纸

    如何画出一张带有表格的A4纸: html: css: A4的大小:21cm*29.7cm(width:794px;...

  • 《高效阅读》书摘17

    需准备的物品 想要阅读的书籍白纸一张(A4纸或者笔记本用纸即可,首先要在纸上画出“三栏表格”,或者使用本书后附的“...

  • html基础

    html标签 文本标签 列表标签 图片和超链接 数据表格 不规则表格

  • 为人子女一场离别,为人父母一场修行

    微博上看到一个新闻,有人做了一个表格,用一张表格来表示人的一生,就是画一个30×30的表格,一张A4纸就够了。每过...

  • PDCA

    一张A4纸,助您做好年度规划 我们可以用一张A4纸来具体执行下面的步骤: 第1步把一张A4纸,按照长边对折再对折。...

  • A4纸人生中的童年趣事

    前两天和朋友聊天,说到A4纸人生。人生差不多900月时间,如果用30*30的表格来衡量,一张A4纸就足够了。 本以...

  • 一看就会得简笔画教程‖护士

    简笔画护士 所需材料:A4纸一张、勾线笔,铅笔,橡皮,水彩笔或马克笔 1、画出护士的帽子和头...

  • 【诗】了却孤独

    一张A4纸一张白色的A4纸一张两面没有写上字的A4纸平躺在我的面前安静如秋,纯洁如雪如我对爱人的想象在这个只有几朵...

  • 一张A4纸的作用

    看到这个标题,你也许不屑一顾:一张A4纸能有什么作用?你可能充满好奇:一张A4纸能有什么作用?那究竟这张A4纸它还...

  • 制作寒假表格

    今天早上,起床刷完牙,就吃早餐,然后我和妈妈去做寒假的表格,首先我和妈妈拿一张A4纸,再把那些表格的线画好,一行一...

网友评论

      本文标题:html画出一张带有不规则表格的A4纸

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