HTML的总结作业

作业1 

参照图使用表格定位表单。

参考代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8"/>
        <title></title>
    </head>
    <body>
        <form action="">
        <table width="600"height="500" border="1" align="center"> 
            <tr  bgcolor=#bdbdbd align="center" >  
                <td    colspan="2" align="center"
                    >用户注册</td> 
            </tr>
        
            <tr>
                <td align="right"
                >用户名</td> 
                <td> <label for="edit"></label>
              <input type="edit" value="" /></td>
            </tr>
        
    
            <tr>
                <td align="right"
                >密码</td>
                <td> <label for="edit"></label>
                <input type="password" value=""/></td>
            </tr>
            
            <tr>
                <td align="right" 
                ><label for="hob">
                    性别
                </label></td>
                <td> 
                <input type="radio" name="性别" value="男" />男
                <input type="radio" name="性别" value="女" />女
                </td>            
            </tr>
            
            <tr>
            <td    align="right">
            <label for="hob">
                爱好
            </label></td>
            <td><input type="checkbox" name="听音乐" value="听音乐" />听音乐
            <input type="checkbox" name="写作" value="写作" />写作
            <input type="checkbox" name="体育" value="体育" />体育
            </td>
            </tr>    
            
            <tr>
                <td align="right">省份</td> 
                <td>
                <select name="省份">    
                <option >陕西</option>
                <option >山西</option>
                <option >广西</option>
                <option >西藏</option>
                </select>
                </td>
            </tr>
        
            <tr>
                <td align="right">自我介绍</td>
                <td>
                <textarea name=""  cols="50" rows="10"></textarea>
                </td>
            </tr>
            
            <tr  bgcolor=#bdbdbd align="center" >
        
            <td    colspan="2" align="center">
                <input type="submit"  name="">
                <input type="reset">
            </td>         
        </table>
        </from>
    </body>

运行截图

作业2

查考代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title></title>
    </head>
    <body>
        <tr>
            <h1>工商银行电子汇款单</h1>
        </tr>
        <table width="1200" height="300" border="1">
            <tr>
                <td width="100" colspan="2"><b>回单类型</b></td>
                <td width="500">网上转账汇款</td>
                <td width="100"colspan="2"><b>指令序号</b></td>
                <td >HQH00000000000000131878172</td>
            </tr>
                
            <tr >
                <td rowspan="4" width="10"><b>收款人</b></td>
                <td width="50">户名</td>
                <td width="500">老马</td>
                <td rowspan="4" width="10"><b>收款人</b></td>
                <td width="50">户名</td>
                <td width="500">老刘</td>
            </tr>
            
            <tr>
                <td><b>卡号</b></td>
                <td>0000000000000000001</td>
                <td><b>卡号</b></td>
                <td>0000000000000000001</td>
            </tr>
            
            <tr>
                <td>地区</td>
                <td>南京</td>
                <td>地区</td>
                <td>杭州</td>
            </tr>
            
            <tr>
                <td><b>网点</b></td>
                <td>工商江苏南京业务处理中心</td>
                <td><b>网点</b></td>
                <td>江苏徐州业务中心</td>
            </tr>
            
            
            <tr>
                <td colspan="2"><b>币种</b></td>
                <td>人民币</td>
                <td    colspan="2"><b>钞汇标志</b></td>
                <td>钞票</td>
            </tr>
            
            <tr>
                <td colspan="2"><b>金额</b></td>
                <td>1.00元</td>
                <td    colspan="2"><b>手续费</b></td>
                <td>0.57元</td>
            </tr>
            
            <tr>
                <td colspan="2"><b>合计</b></td>
                <td colspan="4">人民币(大写):壹园整</td>
            </tr>
            
            <tr>
                <td colspan="2"><b>交易时间</b></td>
                <td><i>2017年6月1日</i></td>
                <td    colspan="2"><b>时间戳</b></td>
                <td>2017-06-01-13.00.00.00000</td>
            </tr>
        </table>
    <td>    
        票据打印时间:2017-06-01:15:00:12<br />
    </td>
    
    <td>
        <del>票据打印单位:江苏徐州业务中心</del><br />
    </td>
    
    <td>
        <del>操作员:大曾</del><br />
    </td>
    </body>
</html>

运行截图

作业三

豆瓣电影

参考代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>form</title>
    </head>
    <body>
        <from action>
            <table width="100%" height="100%"  border="0" cellpadding="10"  cellspacing="10">
                <tr>
                    <td colspan="2" align="left"><h1>热门电影板块</h1></td>    
                </tr>
            
                    <tr align="left"  cellpadding="10"  cellspacing="10">
                        <td><b>最近热门电影</b></td>
                        <td>热门</td>
                        <td>最新</td>
                        <td>豆瓣高分</td>
                        <td>冷门佳片</td>
                        <td>华语</td>
                        <td>欧美</td>
                        <td>韩国</td>
                        <td>日本</td>
                        <td>更多>></td>
                    </tr>
                    
                        
                <table width="100%" height="100%" border="0" 
                    <tr>    
                        <td><img src="./222.webp"></td>
                        <td><img src="./222.webp"></td>
                        <td><img src="./222.webp"></td>
                        <td><img src="./222.webp"></td>
                    </tr>
                    <tr>
                        <td align="center">鸡哥一号 2.5</td>
                        <td align="center">鸡哥二号 2.5</td>
                        <td align="center">鸡哥三号 2.5</td>
                        <td align="center">鸡哥四号 2.5</td>
                    </tr>
                </table>
                    
                <table width="100%" height="100%" border="0">
                    <tr>
                        <td><img src="./222.webp"></td>
                        <td><img src="./222.webp"></td>
                        <td><img src="./222.webp"></td>
                        <td><img src="./222.webp"></td>
                    </tr>
                    <tr>
                        <td align="center">鸡哥五号 2.5</td>
                        <td align="center">鸡哥六号 2.5</td>
                        <td align="center">鸡哥七号 2.5</td>
                        <td align="center">鸡哥八号 2.5</td>
                    </tr>
                
                </table>    
            </table>    
        </from>    
    </body>
</html>

运行截图

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/7238.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

Rust 力扣 - 3090. 每个字符最多出现两次的最长子字符串

文章目录 题目描述题解思路题解代码题目链接 题目描述 题解思路 本题使用滑动窗口进行求解&#xff0c;使用左指针和右指针分别表示窗口的左边界和窗口的右边界&#xff0c;使用哈希表记录窗口内的字符及其对应数量 我们首先向右移动右指针&#xff0c;将字符加入到哈希表中进…

qt qchart添加跟随鼠标的十字线

基于qchart添加跟随鼠标的十字线和item 或许你需要些许QGraphics框架的基础知识,当然照抄这个帖子也是没有任何问题的,也可以实现功能 老套路,一图胜千言 效果如上动图,略微讲一点QGraphics框架的内容 QGraphicsScene是一个item管理集合,QGraphicsView就是scene的眼睛,it…

Flutter PC端UI组件库

一、参考Element-ui的设计和交互&#xff0c;构建基于dart的Flutter UI组件库 https://javonhuang.github.io/sky-ui-page/index.html

让股票数据分析从此如此简单

你是否遇到过&#xff0c;此类事件&#xff0c;一直在上班&#xff0c;没办法自己长时间盯盘&#xff0c;而且&#xff0c;可能会出现&#xff0c;这种情况&#xff0c;各类股票类APP功能巨多&#xff0c;但是呢&#xff0c;自己有自己一套理论&#xff0c;但是又没办法定制&am…

2.3立项【硬件产品立项的核心内容】

硬件产品立项的核心内容 2.3 硬件产品立项的核心内容2.3.1 第一步&#xff1a;市场趋势判断2.3.2 第二步&#xff1a;竞争对手分析1.竞争对手识别2.根据竞争对手分析制定策略 2.3.3 第三步&#xff1a;客户分析2.3.4 第四步&#xff1a;产品定义2.3.5 第五步&#xff1a;开发执…

狼叔的职业成长历程和面对AI的焦虑与自我消解-浪说播客

浪说播客&#xff1a;专注于泛 IT 方向&#xff0c;讨论技术之外的有趣内容。 浪说播客地址&#xff1a;LANGSHUO0.PODCAST.XYZ “浪”是个中性词。它可以指浪潮&#xff0c;也可以表示一种过于兴奋的状态。在可控范围内玩得有趣&#xff0c;这其实才是我最喜欢的理解。当然&am…

C++ OpenCV 理想滤波

理想低通滤波 通过设置频率半径&#xff0c;半径内的频率大小不变&#xff0c;半径外的频率置为0&#xff0c;即保留了低频区&#xff0c;滤除了高频区&#xff0c;达到滤波的目的。 #include<iostream> #include<opencv2/opencv.hpp> #include "MY_DFT.h&qu…

25-RVIZ CARLA插件

RVIZ插件(RVIZ plugin)提供了一个基于RVIZ(RVIZ) ROS包的可视化工具。 用RVIZ运行ROS桥接 RVIZ插件需要一个名为ego_vehicle的自车。要查看ROS-bridge使用RVIZ的示例&#xff0c;请在运行CARLA服务器的情况下执行以下命令&#xff1a; 1. 启用RVIZ启动ROS桥接&#xff1a; # …

鸿蒙OS带来前端的机遇:ArkTS与Typescript+ArkUI与SwiftUI的简单对比你就知道了

随着鸿蒙系统的不断发展&#xff0c;它已逐渐成为智能设备领域的第三大操作系统&#xff0c;与安卓和iOS形成三足鼎立之势。鸿蒙系统不仅在智能手机领域崭露头角&#xff0c;其在智能穿戴、车载、家居等领域的应用也在不断扩展。对于开发者而言&#xff0c;鸿蒙生态的崛起不仅带…

Java+Swing实现的五子棋游戏

JavaSwing实现的五子棋游戏 一、系统介绍二、功能展示1.游戏展示 三、系统实现1.ChessFrame .java 四、其它1.其他系统实现 一、系统介绍 五子棋游戏实现人机对战、人人对战两个模式。 二、功能展示 1.游戏展示 三、系统实现 1.ChessFrame .java package five;import java…

C语言实验 顺序结构

时间&#xff1a;2024.11.1 实验一、7-1 逆序的三位数 #include<stdio.h> int main(){int n,a,b,c;scanf("%d",&n);an%10;bn/10%10;cn/100;printf("%d",a*100b*10c);return 0; }实验二、7-2 求整数均值 #include<stdio.h> int main(){int…

图形几何之美系列:三维实体结构表达

“ 图形几何库提供丰富的几何工具算法&#xff0c;如基础的仿射变换、向量运算、关系计算及高阶的布尔运算、网格剖分、实体造型、曲线曲面等&#xff0c;这离不开基础的三维实体结构表达&#xff0c;而三维实体结构表达的方式有多种&#xff0c;各具特点。” ​ 1.背景简述 …

华为OD机试真题(Python/JS/C/C++)- 考点 - 细节

华为OD机试 2024E卷题库疯狂收录中&#xff0c;刷题 点这里。 本专栏收录于《华为OD机试真题&#xff08;Python/JS/C/C&#xff09;》。

CTFshow之信息收集第1关到10关。详细讲解

得而不惜就该死&#xff01; --章总 开始新的篇章&#xff01; 零、目录 一、实验准备 1、ctf网站&#xff1a;ctf.show 2、工具&#xff1a;chrome浏览器、hackbar插件 3、burpsuite抓包工具 二、实验技巧 &#xff08;一&#xff09;F12摸奖 源码泄露 &#xff08;二…

AI驱动的医疗创新:信息抽取与知识图谱在临床应用中的转变

一、思通数科平台支持多种输入格式&#xff0c;如电子病历、临床数据和医学文献等&#xff0c;并能将这些信息快速转换为结构化数据&#xff0c;包括自动360度不同角度的旋转识别&#xff0c;提升数据的可操作性和可检索性。通过我们的解决方案&#xff0c;医疗机构能够有效整合…

js | undefined vs null vs void 0

背景 你就说为啥吧&#x1f447; console.log(nullundefined,nullundefined); // true false console.log(null false,undefinedfalse) // fasle false console.log(0false,NaNfalse) // true falseconsole.log(0null,0<null); // false true console.log(0false,0<fa…

【YOLOv11[基础]】实例分割Seg | 导出ONNX模型 | ONN模型推理以及检测结果可视化 | python

本文将导出YOLO-Seg.pt模型对应的ONNX模型,并且使用ONNX模型推理以及结果的可视化。话不多说,先看看效果图吧!!! 目录 一 导出ONNX模型 二 推理及检测结果可视化 1 代码 2 效果图

qt QDataStream详解

1. 概述 QDataStream是Qt框架中的一个核心类&#xff0c;主要用于处理二进制数据的序列化和反序列化。它提供了高效、跨平台的方式&#xff0c;将C数据结构转化为字节流&#xff0c;便于在网络传输、持久化存储等场景下使用。QDataStream可以处理包括整数、浮点数、布尔值、字…

云专线优势有哪些?对接入网络有什么要求?

云专线是一种连接企业本地数据中心与云服务提供商之间的专用网络连接方式&#xff0c;具有以下优势&#xff1a; 高安全性&#xff1a;云专线提供了物理隔离的数据传输通道&#xff0c;减少了数据在公共互联网上传输时可能遭遇的安全风险。 低延迟&#xff1a;由于是直接连接&a…

使用python向钉钉群聊发送消息

使用python向钉钉群聊发送消息 一、在钉钉群中新建机器人二、使用代码发送消息 一、在钉钉群中新建机器人 在群设置中添加机器人 选择自定义 勾选对应的安全设置 完成后会展示webhook&#xff0c;将地址复制出来&#xff0c;并记录&#xff0c;后面会用到 二、使用代码发送消…