web前端练习一

1.电子汇款单

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>电子汇款单</title>
</head>
<body><h2>工商银行电子汇款单</h2><table border="1px"><tr><th colspan="2">回单类型</th><!-- <td></td> --><td width="280">网上转账汇款</td><th colspan="2">指令序号</th><!-- <td></td> --><td width="280">HQH000000000000013878172&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td></tr><tr><th rowspan="4">收&nbsp;<br>款&nbsp;<br>人&nbsp;</th><td>户名</td><td>老牟</td><th rowspan="4">付&nbsp;<br>款&nbsp;<br>人&nbsp;</th><td>户名</td><td>老刘</td></tr><tr><!-- <th></th> --><th>卡号</th><td>0000000001</td><!-- <td></td> --><th>卡号</th><td>0000000002</td></tr><tr><!-- <th></th> --><td>地区</td><td>南京</td><!-- <td></td> --><td>地区</td><td>杭州</td></tr><tr><!-- <th></th> --><th>网点</th><td>工商江苏南京业务处理中心&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td><!-- <td></td> --><th>网点</th><td>江苏徐州业务中心</td></tr><tr><th colspan="2">币种</th><!-- <td></td> --><td>人民币</td><th colspan="2">钞汇标志</th><!-- <td></td> --><td><u>钞票</u></td></tr><tr><th colspan="2">金额</th><!-- <td></td> --><td>1.00元</td><th colspan="2">手续费</th><!-- <td></td> --><td>0.57元</td></tr><tr><th colspan="2">合计</th><!-- <td></td> --><td colspan="4">人民币(大写):壹园整</td><!-- <td></td> --><!-- <td></td> --><!-- <td></td> --></tr><tr><th colspan="2">交易时间</th><!-- <td></td> --><td><i>2017年6月1日</i></td><th colspan="2">时间戳</th><!-- <td></td> --><td><i>2017-06-01-13.00.00. 00000</i></td></tr></table>&nbsp;<br><h7>票据打印时间:2017-06-01 15:00:12</h7><br>&nbsp;<br><s><h7>票据打印单位:江苏徐州业务中心</h7></s><br>&nbsp;<br><h7>操作员:大曾</h7></table>
</body>
</html>

2.将进酒

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>将进酒</title>
</head>
<body><b><span style="font-size: 40px;">将进酒</span></b><b><span style="font-size: 33px;">君不见黄河之水天上来</span></b><br><a href="https://baike.baidu.com/item/%E6%9D%8E%E7%99%BD/1043?fr=ge_ala" title="点击了解李白更多"><img src="https://p26.toutiaoimg.com/origin/tos-cn-i-qvj2lq49k0/9ac61cb655c84cf29e7a97c871804fc1?from=pc" width="500" height="560" align="left"></a>&nbsp;<br>&nbsp;<br><div>&nbsp;君不见黄河之水天上来,奔流到海不复回。</div>&nbsp;<br><div>&nbsp;君不见高堂明镜悲白发,朝如青丝暮成雪。</div>&nbsp;<br><div>&nbsp;人生得意须尽欢,莫使金樽空对月。</div>&nbsp;<br><div>&nbsp;天生我材必有用,千金散尽还复来。</div>&nbsp;<br><div>&nbsp;烹羊宰牛且为乐,会须一饮三百杯。</div>&nbsp;<br><div>&nbsp;岑夫子,丹丘生,将进酒,杯莫停。</div>&nbsp;<br><div>&nbsp;与君歌一曲,请君为我倾耳听。</div>&nbsp;<br><div>&nbsp;钟鼓馔玉不足贵,但愿长醉不复醒。</div>&nbsp;<br><div>&nbsp;古来圣贤皆寂寞,惟有饮留其名。</div>&nbsp;<br><div>&nbsp;陈王昔时宴平乐,斗酒十千恣欢谑。</div>&nbsp;<br><div>&nbsp;主人何为言少钱,仅须沽取对君酌。</div>&nbsp;<br><div>&nbsp;五花马,千金裘,</div>&nbsp;<br><div>&nbsp;呼儿将出换美酒,五二同销万古愁。</div>&nbsp;<br>
</body>
</html>

3.电影模块

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>电影板块</title>
</head>
<body><h2>热门电影模块</h2><hr><table><tr><td width="200"><b>最近热门电影</b></td><td width="90">热门</td><td width="90">最新</td><td width="120">豆瓣高分</td><td width="150">冷门佳作</td><td width="90">华语</td><td width="90">欧美</td><td width="90">欧美</td><td width="90">韩国</td><td width="300">日本</td><td width="90">更多&lt;&lt;</td></tr></table><hr><table width="1250"><tr><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td></tr><tr><td height="45">猜火车 8.1</td><td>贝尔实验 6.0</td><td>加州公路巡警 6.8</td><td>歌声不绝 6.3</td></tr><tr><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td><td width="302"><img src="../04.图片音频视频标签/image/古风.jpg" width="306" height="200"></td></tr><tr><td height="45">明日的我与昨日的你 7.5</td><td>激情与速度8 8.1</td><td>极速特工 6.4</td><td>金刚狼3:殊死一战 7.6</td></tr></table>
</body>
</html>

4.用户注册页面

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>用户注册页面</title>
</head>
<body>   <form action="https:www.baidu.com" method="post"><table align="center"><tr><td colspan="2" align="center"><h3>用户注册</h3></td><!-- <td></td> --></tr><tr><td>用户名:</td><td><p><input type="text" name="username"></p></td></tr><tr><td>密码:</td><td><p><input type="password" name="password"></p></td></tr><tr><td>性别:</td><td><p><input type="radio" name="gender" value="男">男    <input type="radio" name="gender" value="女">女             </p></td></tr><tr><td>省份:</td><td><select name="provice"><option value="provice1" selected="">广东省</option><option value="provice2">陕西省</option><option value="provice3">湖北省</option><option value="provice4">江西省</option><option value="provice5">辽宁省</option><option value="provice6">四川省</option><option value="provice7">山东省</option><option value="provice8">吉林省</option><option value="provice9">......</option></select></td></tr><tr><td>爱好:</td><td><p><input type="checkbox" name="hobby" value="唱">唱<input type="checkbox" name="hobby" value="跳">跳<input type="checkbox" name="hobby" value="rap">rap<input type="checkbox" name="hobby" value="篮球">篮球<input type="checkbox" name="hobby" value="其他">其他</p></td></tr><tr><td>邮箱:</td><td><p><input type="email" name="email" id=""></p></td></tr><tr><td>联系电话:</td><td><p><input type="text" name="phone" id=""></p></td></tr><td>入职时间:</td><td><p><input type="date" name="date"></p></td></tr><tr><td>离职时间:</td><td><p><input type="date" name="date"></p></td></tr><tr><td>自我介绍:</td><td><textarea name="introduce" cols="30" rows="5">请输入100字左右</textarea></td></tr><tr><td colspan="2" align="center"><p><input type="reset"><input type="submit" value="提交"></p></td><!-- <td></td> --></tr></table></form>
</body>
</html>

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C语言自学笔记10----C语言数组

C 语言数组 数组是可以存储多个值的变量。例如&#xff0c;如果要存储100个整数&#xff0c;则可以为其创建一个数组。 示例 int data[100]; 例如&#xff0c; float mark[5]; 在这里&#xff0c;我们声明了一个浮点类型的数组mark。其大小为5。意味着&#xff0c;它可以容纳5个…

MySQL row_number()函数,rank()函数和dense_rank()函数

从MySQL8.0开始引用row_number(), rank()函数和dense_rank()函数&#xff0c;也就是常见的窗口函数&#xff0c;三个函数都是一种用于计算排名的工具&#xff0c;它们根据指定的列对结果集进行排序&#xff0c;并为每一行分配一个排名值&#xff08;1,2,3,...&#xff09;。 函…

【漏洞复现】网康科技 NS-ASG 应用安全网关 SQL注入漏洞(CVE-2024-2330)

免责声明&#xff1a;文章来源互联网收集整理&#xff0c;请勿利用文章内的相关技术从事非法测试&#xff0c;由于传播、利用此文所提供的信息或者工具而造成的任何直接或者间接的后果及损失&#xff0c;均由使用者本人负责&#xff0c;所产生的一切不良后果与文章作者无关。该…

CoSaMP算法实现压缩感知的MATLAB实现

CoSaMP(Compressive Sampling Matching Pursuit)算法是一种基于稀疏表示的信号重构算法,它是对OMP(Orthogonal Matching Pursuit)算法的改进。CoSaMP算法在信号重构和压缩感知领域有着广泛的应用,特别是在处理稀疏信号时表现出色。 基本定义 下面是对CoSaMP算法的详细解…

(自用笔记)每天一点vue3—— echarts横坐标刻度标签显示不完全的问题

我是想做一个vue3echarts的账单数据展示项目&#xff0c;因为有vue2的基础&#xff0c;打算直接在这个项目上熟悉掌握vue3的新特性。这系列笔记就按照遇见问题解决问题的思路更新&#xff0c;不按照官方快速上手的章节&#xff0c;特此说明。 echarts 上次遗留一个横坐标刻度标…

strcat函数

函数理解记忆&#xff1a;str表示是<string.g>中的函数&#xff0c;cat表示附加。意思是将一个字符串的内容附加到另一个字符串的末尾。 注意要点&#xff1a;既然要附加&#xff0c;附加的字符串和被附加的字符串都要有\0。否则不知道附加多少&#xff0c;不知附加在哪…

Jtti:如何在CentOS中安装和配置Tomcat应用服务器

在CentOS中安装和配置Tomcat应用服务器非常简单&#xff0c;以下是一种基本的步骤&#xff1a; 步骤 1: 安装Java 首先&#xff0c;确保您的系统上已经安装了Java Development Kit (JDK)。Tomcat需要Java环境来运行。 sudo yum install java-devel 步骤 2: 下载和解压Tomcat 访…

免费视频背景素材下载

找免费视频素材、背景就上这6个网站&#xff0c;高质量&#xff0c;无版权可商用。 1、菜鸟图库 https://www.sucai999.com/video.html?vNTYwNDUx 菜鸟图库虽然是个设计素材网站&#xff0c;但除了设计类素材之外还有很多视频、音频、办公类等素材&#xff0c;视频素材就有上…

前端实现复制粘贴功能

在前端开发的世界里&#xff0c;复制粘贴功能就像是那个总是被忽视&#xff0c;却在关键时刻能救你一命的老朋友。我们习惯了用那些古老的魔法咒语&#xff08;document.execCommand(copy)&#xff09;来实现这一功能&#xff0c;但时代在进步&#xff0c;技术在更新&#xff0…

Frostmourne - Elasticsearch源日志告警配置

简介 配置Frostmourne 接入Elasticsearch源进行日志匹配告警&#xff0c;并静默规则&#xff0c;告警消息发送到企业微信&#xff0c;告警信息使用Markdown。 部署安装教程查看&#xff1a; https://songxwn.com/frostmourne_install ELK 安装教程&#xff1a;https://songx…

[C/C++] -- 双指针

1.简介 双指针技巧是一种常见的算法解题方法&#xff0c;通过使用两个指针在数据结构上同时移动&#xff0c;可以解决多种问题。这种技巧通常适用于数组、字符串和链表等数据结构&#xff0c;下面我将详细介绍双指针技巧的特点和应用场景&#xff1a; 特点&#xff1a; 快慢…

综合实验---Web环境搭建

题目&#xff1a; 服务器IP地址规划&#xff1a;client&#xff1a;12.0.0.12/24&#xff0c;网关服务器&#xff1a;ens36:12.0.0.1/24、ens33&#xff1a;192.168.10.1/24&#xff0c;Web1&#xff1a;192.168.10.10/24&#xff0c;Web2&#xff1a;192.168.10.20/24&#xf…

pcl弧度角度换算:rad2deg,deg2rad

角度弧度换算公式: 代码及结果在:cmath 中cos sin等常用函数的坑(弧度角度换算)-CSDN博客 pcl也有自带的rad2deg,deg2rad: 头文件 #include<pcl/common/angles.h> 代码如下 #include <iostream> #include<pcl/common/angles.h> int main() {vector<…

3/13/24运算符、补码、整型、浮点型、汇编

目录 三目运算符 逗号运算符 自增自减运算符 位运算 运算符优先级 补码讲解 整型解析 溢出解析 浮点数IEEE754标准解析 浮点数精度丢失 真题 汇编指令 生成汇编方法 常用指令 三目运算符 条件运算符是C语言中唯一的三目运算符。通过判断问号之前的表达式的真假&…

【随笔记】小程序轮播图,一屏显示三个swiper-item

常见的轮播是一屏显示一个swiper-item,有的时候需要一屏显示三个swiper-item,左右两边都显示出一点 【目前小程序基础库2.12.3 效果正常,3.几的效果会有点不正常】 效果图 wxml <!-- 轮播begin --> <swiper wx:if="{{up_down}}" class="card-swipe…

【C++】thread 头文件无法正常使用问题

问题 当我使用MinGW GCC&#xff0c;在windows上编写C程序的时候&#xff0c;使用thread类会无法编译&#xff0c;有如下错误&#xff1a; 我使用的是c17 这个问题原因是MinGW GCC当前仍缺少标准C 11 及以上版本线程类的实现。 解决方案 Stackoverflow上的类似问题: 传送门…

a-table:实现跨域多选功能——基础积累

table组件跨页多选功能&#xff1a; html部分的代码&#xff1a; <a-tablesize"small"style"margin-top: 10px"rowKey"id":columns"columns":dataSource"dataSource":pagination"pagination":loading"l…

零基础自学C语言|自定义类型:联合与枚举

✈联合体 &#x1f680;联合体的类型声明 像结构体一样&#xff0c;联合体也是由一个或者多个成员构成&#xff0c;这些成员可以不同的类型。 但是编译器只为最大的成员分配足够的内存空间。联合体的特点是所有成员共用同一块内存空间。所以联合体也叫&#xff1a;共用体。 给…

机试:计算第几天

问题描述: 代码示例: //计算第几天 #include <bits/stdc.h> using namespace std;int main(){cout << "输入样例" << endl; int year;int month;int day; cin >> year >> month >> day;int months1[12] {31,28,31,30,31,30,3…

Java错误:微服务报错Cannot execute request on any known serve

&#x1f414;问题内容 报Cannot execute request on any known server 这个错&#xff1a;连接Eureka服务端地址不对。 &#x1f414;解决方式 检查.yml文件或者.properties文件配置 下划线下划线后面的小写字母等同于去掉下划线大写下划线后面的字母&#xff08;驼峰原则&am…