Web前端开发技术学习(三)表格和表单

3 篇文章 0 订阅
2 篇文章 0 订阅
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>My project</title>
    <style>
        body {
            background-image: url(image/01.PNG);
            background-size: cover;
        }

        h1 {
            color: rgb(22, 22, 224);
            text-align: center;
            font-family: 隶书;
        }

        h2 {
            color: dodgerblue;
            text-align: center;
            font-family: 黑体;
        }

        h3 {
            color: maroon;
            text-align: center;
            font-family: 华文琥珀;
            font: size 100px;
            font-weight: 100;
            font-style: normal;
        }

        ul {
            list-style-type: none;
        }

        li {
            width: 80px;

        }
    </style>

</head>

<body>
    <hr size="8" color="black">
    <h1 align="center">
        国产芯
    </h1>
    <hr size="8" color="blueviolet">
    <table width="1400" height="150px" border="4" bgcolor="skyblue" bordercolor="black">
        <caption>
            <h1>各领域龙头</h1>
        </caption>
        <tr>
            <th>分类</th>
            <th>移动CPU</th>
            <th>计算机CPU/MPU</th>
            <th>IP</th>
            <th>GPU</th>
            <th>ASIC</th>
            <th>DSP</th>
            <th>FPGA</th>
            <th>EDA</th>
            <th>MCU</th>

        </tr>
        <tr>
            <th>NO.1</th>
            <td>华为海思</td>
            <td>龙芯中科</td>
            <td>芯原</td>
            <td>景嘉微</td>
            <td>中星微电子</td>
            <td>国睿科技</td>
            <td>深圳紫光同创</td>
            <td>北京华大九天</td>
            <td>北京兆易创新</td>
        </tr>
        <tr>
            <th>NO.2</th>
            <td>紫光展锐</td>
            <td>兆芯</td>
            <td>寒武纪</td>
            <td>中船重工</td>
            <td>寒武纪科技</td>
            <td>四创电子(魂微)</td>
            <td>上海安路科技</td>
            <td>杭州广立微</td>
            <td>中颖电子</td>
        </tr>
        <tr>
            <th>NO.3</th>
            <td>翱捷</td>
            <td>飞腾</td>
            <td>芯来科技</td>
            <td>芯原微电子Veri Silicon</td>
            <td>启英泰伦</td>
            <td>振芯科技</td>
            <td>广东高云半导体</td>
            <td>芯和半导体</td>
            <td>华润微电子</td>
        </tr>
        <tr>
            <th>NO.4</th>
            <td>台湾联发科</td>
            <td>申威</td>
            <td>华夏芯</td>
            <td>燧原科技</td>
            <td>云知声</td>
            <td>杰赛科技</td>
            <td>上海复旦微电子</td>
            <td>天津蓝海微</td>
            <td>上海华大半导体</td>
        </tr>

    </table>
    <hr size="8" color="black">
    <h2>单元格跨列、跨行</h2>
    <hr size="8" color="blueviolet">
    <table border="4" width="1400px" align="center" bordercolor="black" bgcolor="powderblue">
        <caption>
            <h2>表一:法案中资金分配计划</h2>
        </caption>
        <tr align="center">
            <td>序号</td>
            <td>相关计划</td>
            <td>主要内容</td>
            <td>总金额</td>
            <td>具体分配策略</td>
        </tr>
        <tr align="center">
            <td>1</td>
            <td>半导体制造激励计划</td>
            <td>在5年内提供资金,60亿美金可能用于直接贷款和贷款担保的成本。在先进芯片制造方面,提供25%的投资税收抵免。</td>
            <td>390亿美金</td>
            <td>2022年将拨款190亿美金,其中20亿美金用于传统芯片生产,优先考虑汽车行业等关键制造业。2023-2026年每年50亿美金。</td>
        </tr>
        <tr align="center">
            <td>2</td>
            <td>商业研发和劳动力发展计划</td>
            <td>在5年内提供资金,支持包括国家半导体技术中心(NSTC)、国家先进封装制造计划以及其他研发和劳动力发展计划。</td>
            <td>110亿美金</td>
            <td>2022年将拨款50亿美金,其中20亿美金用于NSTC(国家半导体技术中心)、25亿美金用于先进封装。其他项目5亿美金。2023-2026年分别拨款20、13、11、6亿美金。</td>
        </tr>
        <tr align="center">
            <td>3</td>
            <td>美国劳动力和教育基金</td>
            <td>在5年内提供资金,支持国家科学基金会,以促进半导体劳动力的增长</td>
            <td colspan="2">2亿美金</td>
        </tr>
        <tr align="center">
            <td>4</td>
            <td>国防部国防基金</td>
            <td>用于实施微电子军民共享计划,更快将实验室成果转化为军事和其他应用</td>
            <td colspan="2">20亿美金</td>
        </tr>
        <tr align="center">
            <td>5</td>
            <td>国际技术安全和创新基金</td>
            <td>基金将在5年内分配给国务院,与美国国际开发署等合作,旨在与外国政府合作伙伴协调通讯、电信、半导体技术等先进技术的协作,建立安全可靠的半导体供应链。</td>
            <td colspan="2">5亿美金</td>
        </tr>
    </table>
    <hr size="8" color="blueviolet">

    <table border="4" width="1400px" align="center" bordercolor="black" bgcolor="cornflowerblue">
        <caption>
            <h3>表二:EDA产业链中下游</h3>
        </caption>
        <tr align="center">
            <td>资料来源</td>
            <td>硬件设备</td>
            <td>操作系统</td>
            <td>开发工具</td>
            <td>辅助性软件</td>
        </tr>
        <tr align="center">
            <td rowspan="6">前沿产业研究院、华福证券研究所</td>
            <td colspan="4">EDA工具</td>
        </tr>
        <tr align="center">
            <td>芯片设计</td>
            <td colspan="2">晶圆制造</td>
            <td>封测</td>
        </tr>
        <td colspan="4">
            <ul>
                <li><a href="https://www.intel.cn/content/www/cn/zh/homepage.html"
                        name="intel">intel&nbsp;&nbsp;&nbsp;英&nbsp;特&nbsp;尔</a></li>
                <li><a href="https://www.tsmc.com/english" name="tamc">tamc&nbsp;&nbsp;&nbsp;台&nbsp;积&nbsp;电</a></li>
                <li><a href="https://www.smics.com/" name="smic">SMIC&nbsp;&nbsp;&nbsp;中&nbsp;芯&nbsp;国&nbsp;际</a></li>
            </ul>
        </td>
        <tr align="center">
            <td colspan="4">EDA工具的使用贯穿整个集成电路设计和制造流程</td>
        </tr>

    </table>
    <hr size="8" color="black">
    <h2>表单</h2>
    <h5>个人信息</h5>
    <form>
        姓名:<input type="text" name="Daniel" maxlength="25" size="15" />
        个人身份:<input type="text" name="Shining" readonly value="学生"><br>
        密码:<input type="password" name="psw" maxlength="20" size="10">
    </form>

    <hr size="8" color="blue">
    <form>
        <fieldset>
            <legend>其他信息</legend>
            <h5>年级:</h5>
            <select name=" " size="5" >
                <option selected value=" " >年级</option>
                <option value=" " >大一</option>
                <option value=" " >大二</option>
                <option value=" " >大三</option>
                <option value=" " >大四</option>
                <option value=" " >研一</option>
                <option value=" " >研二</option>
                <option value=" " >研三</option>
            </select>
            </fieldset>
            爱好:<input type="checkbox" name="hobby" value="读书 read books" />读书
            <input type="checkbox" name="hobby" value="唱歌 Sining" />唱歌
            <input type="checkbox" name="hobby" value="游戏 games" />游戏<br>
            自荐书:<textarea name="text" rows="4" cols="60" wrap="virtual"></textarea>
        </fieldset>
        <h5>请选择文件(自荐书)</h5>
        <input type="file" name="file" size="30"><br>
        <input type="hidden" name="admin" value="ABCD">
    </fieldset>
    </form>
    <hr size="8" color="blue">
    <h3>问卷</h3>
    <form>
        <table border="4" width="1400px" align="center" bordercolor="black" bgcolor="powderblue">
            <caption>
                <h1>“动物之最”趣味测试</h1>
                <tr>
                    <td>
                        <b>
                            <p style="text-indent:2em;">
                                大千世界,无奇不有,大自然母亲孕育了成千上万种动物与我们共同生存。
                                完成这份“动物之最”测试卷,看看你对动物们了解多少吧?
                            </p>
                        </b>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>1.世界上最小的鸟是()。</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b1" value="b1">珍珠鸟</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b1" value="b1">鹌鹑</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b1" value="b1">小刺嘴莺</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b1" value="b1">吸蜜蜂鸟</td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>2.世界上游泳最快的鸟是()。</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b2" value="b2">天鹅</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b2" value="b2">企鹅</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b2" value="b2">绿头鸭</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b2" value="b2">鸬鹚</td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>3.世界上羽毛最多的鸟是()。</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b3" value="b3">绿头鸭</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b3" value="b3">大丽鹃</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b3" value="b3">信天翁</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b3" value="b3">天鹅</td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>4.世界上适应能力最强的猛禽是()。</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b4" value="b4">兀鹫</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b4" value="b4">信天翁</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b4" value="b4">金雕</td>
                            </tr>
                            <tr>
                                <td><input type="radio" name="b4" value="b4">猫头鹰</td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>5.请选出符合鸵鸟的特征(多选)</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">产蛋最大的鸟</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">拥有最大细胞的动物</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">世界上存活最大的鸟</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">孵化周期最长的鸟</td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>6.请选出符合蓝鲸的特征(多选)</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">世界上体积最大的动物</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">世界上最重的动物</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">游得最快的动物</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">世界上最凶猛的动物</td>
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr>
                    <td>
                        <table>
                            <tr>
                                <td>7.一起常常被称为“人类最直系的亲属”</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">红毛猩猩</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">大猩猩</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">黑猩猩</td>
                            </tr>
                            <tr>
                                <td><input type="checkbox" name="a1" value="a1">六耳猕猴</td>
                            </tr>
                        </table>
                    </td>
                </tr>

                <tr>
                    <td align="center"  height="50px">
                        <input type="submit" value="提交">
                    </td>
                </tr>
            </caption>

        </table>
    </form>
</body>

</html>

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Shining0596

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值