web中html文件编写

于 2024-07-06 19:50:09 发布
阅读量693 收藏 7
点赞数 13
文章标签： 前端 html 服务器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_80632830/article/details/140234493
版权

A.

写一个.html文件，要求如下

1.用户名为文本框，名称为UseName,长度为15，最大字符数为20。

2.密码为密码框，名称为UserPass，长度为15，最大字符数为20,

3.性别为两个单选按钮，名称为 sex,值分别为男和女，男默认选中。

4.爱好是三个多选按钮，名称为like，值分别为写作、听音乐、体育。

5.省份为下拉框，名称为 province，选项的键-值对为Key陕西省，value:shaanxi ; Key:山西省，value:shanx;陕西省默认选中,

6.自我介绍为多行文本框，名称为intro，宽25，高5，默认值为“这个家伙什么也没留下”。

7.提交按钮，名称为“send”，标签为“提交”。

8.重 按钮，名称为“reset”，标签为“重置”

9.参照图使用表格定位表单

B.编写一份电子汇款单

C.古诗词按格式输出

D.热门电影网站

1.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>用户信息表单</title>
</head>
<body>
    <table>
        <tr>
            <td>用户名：</td>
            <td><input type="text" name="UseName" maxlength="20" size="15"></td>
        </tr>
        <tr>
            <td>密码：</td>
            <td><input type="password" name="UserPass" maxlength="20" size="15"></td>
        </tr>
        <tr>
            <td>性别：</td>
            <td><input type="radio" name="sex" value="男" checked> 男
                <input type="radio" name="sex" value="女"> 女</td>
        </tr>
        <tr>
            <td>爱好：</td>
            <td><input type="checkbox" name="like" value="写作"> 写作
                <input type="checkbox" name="like" value="听音乐"> 听音乐
                <input type="checkbox" name="like" value="体育"> 体育</td>
        </tr>
        <tr>
            <td>省份：</td>
            <td><select name="province">
                    <option value="shaanxi" selected>陕西省</option>
                    <option value="shanxi">山西省</option>
                </select></td>
        </tr>
        <tr>
            <td>自我介绍：</td>
            <td><textarea name="intro" rows="5" cols="25">这个家伙什么也没留下</textarea></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" name="send" value="提交">
                <input type="reset" name="reset" value="重置"></td>
        </tr>
    </table>
</body>
</html>

 2.
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表格</title>
</head>
<body>
    <table border="1px">
        <thead>
            <tr>
                <th>回单类型</th>
                <th>网上转账汇款</th>
                <th>指令序号</th>
                <th>HQH0000000000000000013878172</th>
            </tr>
        </thead>
        <!--表格划分-体 -->
        <tbody>
            <tr>
                <td>收</td>
                <td>户名</td>
                <td>老牟</td>
                <td>付</td>
                <td>户名</td>
                <td>老刘</td>
            </tr>
            <tr>
                <td>款</td>
                <td>卡号</td>
                <td>00000000000000001</td>
                <td>款</td>
                <td>卡号</td>
                <td>00000000000000002</td>
            </tr>
            <tr>
                <td>人</td>
                <td>地区</td>
                <td>南京</td>
                <td>人</td>
                <td>地区</td>
                <td>杭州</td>
            </tr>
            <tr>
                <td>  </td>
                <td>网点</td>                
                <td>工商江苏南京业务处理中心</td>
                <td>  </td>
                <td>网点</td>
                <td>江苏徐州业务中心</td>  
            </tr>
            <tr>
                <td>币种</td>
                <td>人名币</td>
                <td>钞汇标志</td>
                <td>钞票</td>            
            </tr>
            <tr>
                <td>金额</td>
                <td>1.00元</td>    
                <td>手续费</td>
                <td>0.57元</td>        
            </tr>
            <tr>
                <td>合计</td>
                <td>人名币（大写）：壹元整</td>
                <td></td>
                <td></td>
            </tr>
            <tr>
                <td>交易时间</td>
                <td>2017年6月1日</td>
                <td>时间戳</td>
                <td>2017-06-01-13.00.00.000000</td>
            </tr>
        </tbody>
    </table>
    <p>票据打印时间：2017年6月1日 13:00:12</p>
    <p><s>票据打印单位：江苏徐州业务中心</s></p>
    <p>操作员：大曾</p>
</body>
</html>

3.
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <table>
    <p><b><big>将进酒</big></b></p>
    <tr>
        <td><img src="https://bkimg.cdn.bcebos.com/pic/f2deb48f8c5494eef01f7c7518a3f7fe9925bc31d01b?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080"alt=""
            width="500px"
            height="500px"></td>
        <td>
            <pre>
                    君不见黄河之水天上来，奔流到海不复回。
                    君不见高堂明镜悲白发，朝如青丝暮成雪。
                    人生得意须尽欢，莫使金樽空对月。
                    天生我材必有用，千金散尽还复来。
                    烹羊宰牛且为乐，会须一饮三百杯。
                    岑夫子，丹丘生，将进酒，杯莫停。
                    与君歌一曲，请君为我倾耳听。
                    钟鼓馔玉不足贵，但愿长醉不愿醒。
                    古来圣贤皆寂寞，惟有饮者留其名。
                    陈王昔时宴平乐，斗酒十千恣欢谑。
                    主人何为言少钱，径须沽取对君酌。
                    五花马、千金裘，呼儿将出换美酒，与尔同销万古愁。
            </pre>
        </td>
    </tr>
</table>
</body>
</html>

4.
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>电影</title>
</head>
<body>
        <b><big>热门电影板块</big></b>
        <hr>
        <b>最近热门电影</b>
        热门
        最新
        豆瓣高分
        冷门佳片
        华语
        欧美
        韩国 
        日本
        更多>>
    <table>
        <thead>
            <tr>    
                <hr>
            </tr>
            <tr>
            <td><img src="https://ts1.cn.mm.bing.net/th/id/R-C.2dab326f9306899f2ecd7a4cd44bc983?rik=wUIsD4CWCq%2f%2bgA&riu=http%3a%2f%2fi.gtimg.cn%2fqqlive%2fimg%2fjpgcache%2ffiles%2fqqvideo%2fw%2fwqynqfrosy8nljg.jpg&ehk=UItA%2bYeLrjU2UFK14%2fcC3QOPiLDP3cu1x5dSt1chLMk%3d&risl=&pid=ImgRaw&r=0"alt="" 
                width="150" 
                height="200"></td>
            <td><img src="https://www.rrppt.com/uploads/jiaocheng/rr12143.jpg"alt=""
                width="150" 
                height="200"></td>   
            <td><img src="https://img.zcool.cn/community/0104175e0dde95a801216518e29d10.jpg@1280w_1l_2o_100sh.jpg"alt=""
                width="150" 
                height="200"></td>
            <td><img src="https://img.zcool.cn/community/01c1335d3ffa0fa8012187f4a957bc.jpg@1280w_1l_2o_100sh.jpg"alt=""
                width="150"
                height="200"></td>
            <td></td>
        </tr>
        <tr>
            <td><big>萧红</big></td>
            <td><big>幕后玩家</big></td>
            <td><big>急先锋</big></td>
            <td><big>烈火英雄</big></td>
        </tr>
        </thead>
        <tbody>
            <tr>
                <td><img src="https://ts1.cn.mm.bing.net/th/id/R-C.95c56c691d2d19d83d07ad4e85d10193?rik=D5AhGK5O5YAjbQ&riu=http%3a%2f%2fwww.guangyuanol.cn%2fuploads%2fallimg%2f210213%2f10041M516-0.jpg&ehk=cn8q4F9MU5j34HLUmg%2f3FibAnrrBkNKIc2BWZEmPA54%3d&risl=&pid=ImgRaw&r=0"alt="" 
                    width="150" height="200"></td>
                <td><img src="https://img.zcool.cn/community/011b2b5b9a2b21a801213deaa2f0d1.jpg@2o.jpg"alt="" 
                    width="150" height="200"></td>
                <td><img src="https://ts1.cn.mm.bing.net/th/id/R-C.d442ae985dd23ec68f134597895ee430?rik=fDtXA%2fCJbC8hsQ&riu=http%3a%2f%2f5b0988e595225.cdn.sohucs.com%2fimages%2f20191006%2fe87e43de31c94fa987fd6e6ad545706a.jpeg&ehk=p0NMiYDurzjNWJPi8yVhJ8p8S%2fLbMoEVON7bFcQTD7M%3d&risl=&pid=ImgRaw&r=0"alt="" 
                    width="150" height="200"></td>
                <td><img src="https://ts1.cn.mm.bing.net/th/id/R-C.498567b3fcc9eec5457efcd863a3a557?rik=TTrAQFM%2fjrH9qg&riu=http%3a%2f%2fn.sinaimg.cn%2fsinakd20110%2f192%2fw1080h1512%2f20201107%2f9082-kcpxnww1523184.jpg&ehk=hKH8BC90aWfRpiY49fs65Rng0H10qq2h8uNHgbOapc0%3d&risl=&pid=ImgRaw&r=0"alt="" 
                    width="150" height="200"></td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
            <td><big>唐人街探案3</big></td>
            <td><big>影</big></td>
            <td><big>joker</big></td>
            <td><big>人潮汹涌</big></td>
            </tr>
        </tfoot>
    </table>
</body>
</html>

 

 

匀泪
关注
使用 HTML、CSS、JS 和 API 制作一个很棒的天气 Web 应用程序
努力是为了站在万人之中，成为别人的光
07-25 4万+
今天我将使用 Wea​​ther 和 Unsplash API 以及倾斜效果和玻璃形态外观创建凉爽的天气应用程序 ⛅ Weather.io ☔⚓ 第 1 步 - 设置环境并收集所有资源 第 2 步 - 从 index.html 开始 第 3 步 - 设置索引文件的样式 第 4 步 - 获取 Weather API 和 Unsplash API 密钥 第 5 步 - 从 JavaScript 编码开始 第 6 步 - 免费托管您的网站！
前端基础应用：html文件编写
m0_58239511的博客
09-14 882
前端网页页面制作主要是写html，接下来我从他的两个标题head和body标签进行学习。
HTML文件怎么写？简述构成HTML文件的几大元素
伯约同学的前端学习之路
02-27 823
HTML文件怎么写？简述构成HTML文件的几大元素 如何编写一个html文件，可能是一个前端小白最应该了解的问题。 今天就针对html文件构成的几大元素做一个讲解并简述一下它对应的属性 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>文档的标题</title> <link href="./test.css"> </head> <bod
html文件的写法,HTML上传文件写法
weixin_27303545的博客
06-03 282
来源于：http://www.cnblogs.com/SkySoot/p/3525139.htmlhtml 表单上传文件一般处理程序由于没有 apsx 页面的整个模型和控件的创建周期，而比较有效率。这里写一个用 html 表单进行文件上传的示例。1. 表单元素选用 控件。2. form 表单需要设置enctype="multipart/form-data"属性，请求报文体中数据格式也由键值对...
编写一个最基本的html文件,HTML入门
weixin_42503645的博客
06-29 513
想要成为一名合格的前端工程师，需要学习的内容很多，网上有专门罗列出来的思维导图，密密麻麻列出一堆，让人望而怯步。但是，千里之行，始于足下，只要我们一点一点地去学习和实践，内化所有的知识和技能，最终就能达到理想的目的地。而我所需要做的，就是脚踏实地、一点一点地掌握。什么是网页？当你在电脑或手机上使用某款浏览器，打开百度、新浪等网站的时候，你看到的就是一个网页，而网页的本质是一个HTML文件。这个网页...
HTML脚本
时光的博客
06-11 454
HTML脚本：JavaScript 使 HTML 页面具有更强的动态和交互性。HTML &lt;script&gt; 标签&lt;script&gt; 标签用于定义客户端脚本，比如 JavaScript。&lt;script&gt; 元素既可包含脚本语句，也可通过 src 属性指向外部脚本文件。JavaScript 最常用于图片操作、表单验证以及内容动态更新。HTML&lt;noscript&gt...
VB6.0编写的简易WEB服务器
01-04
在项目中，"VB简易WEB服务器"可能包含了实现以上功能的VB6.0源代码文件。通过学习和分析这些代码，你可以了解到如何将理论知识转化为实际应用，从而加深对网络编程和HTTP协议的理解。 在实践过程中，你可能会遇到的...
html文件在JAVAweb目录位置,【idea】关于idea中Java Web项目的访问路径问题
weixin_42393198的博客
06-09 3964
关于本篇，能够结合以前一篇来理解：java另外本篇博客参考了另一位大佬博主(@WinstonLau)的文章，很是感谢大佬浏览器另外，IDEA确实是一款很好用的IDEA，在逐步上手后我逐渐喜欢上了它……jsp————————————————————————————————————————————————————————ideIDEA在出上手学习时，甚至说在刚开始学习JSP时，咱们最大的一个问题在于对...
WebServer.zip_Web 文件服务_web服务器
07-15
c）利用HTML语言编写网页（可以不包括图像、声音等多媒体文件），浏览器可通过编写的Web服务器正常访问该网页； d）支持多用户并发访问； e）在Windows平台下，采用C/C++语言； f）扩展编写的简单Web服务器，使...
在Web API中使用jQuery AJAX实现文件上传的例子
09-09
在现代Web应用中，文件上传是一个常见的功能，它允许用户向服务器提交各种类型的文件。本教程将详细介绍如何在ASP.NET Web API中结合jQuery的AJAX方法实现文件上传。 首先，我们需要在客户端创建一个HTML表单，用于...
HTML基本写法
m0_58724783的博客
11-09 650
1. 框架集：结构化设计思想： 2. frameset不能放在body中 3.rows、cols分别实现将分框按照上下和左右结构来部署 4.如果需要和的target配合使用_parent，当框架集有两个以上层次的 5.必须要做框架分层 6列： 1. 2. 3. src属性 4.
HTML基础范例
weixin_39037804的博客
08-17 308
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</t...
JavaScript客户端脚本编程(2)
martinue
07-02 806
1．编写一个程序，输出如下图案。              *             ***            *****           ******* <%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%> Insert
html脚本详解,HTML脚本教程详解
weixin_35045973的博客
07-08 265
在线实例插入一段脚本如何将脚本插入 HTML 文档。使用 标签如何应对不支持脚本或禁用脚本的浏览器。HTML 标签 标签用于定义客户端脚本，比如 JavaScript。 元素既可包含脚本语句，也可通过 src 属性指向外部脚本文件。JavaScript 最常用于图片操作、表单验证以及内容动态更新。下面的脚本会向浏览器输出"Hello World!"：实例document.write("Hell...
html简单案例
陈表达的博客
10-12 1449
属性指定了控件类型，如文本框、邮箱和密码等。标签定义超链接，将该链接指向百度网站。属性给不同的元素命名。标签定义了网页的样式，使用。是两个具有不同样式的区域。标签显示一级标题，使用。标签定义表头和单元格。标签定义表单标签，使用。标签定义表单控件，其中。标签布局网页，并使用。
HTML格式及案例
weixin_44126843的博客
08-30 348
属性：属性是描述一个物体特征的名词，例如：桌子的属性（长、宽、高、颜色等等） 例。双边标记，是指有开始和结束标记，内容放在开始和结束标记之间，例如（标签是一个双。双边标记的内容是在开始标签和结束标签之间的。浏览器是渲染网页用的，每个浏览器都有自己的内核（浏览器内核）超文本：其实就是网页上的文本、图片，音频、视频等等。单边标记：指的是只有开头，没有结尾的标记。中一种规范，一种标准，编写网页的一种标准。有的标记是没有属性的。标签中存放的是网页的主体内容。、双边标记（双标记标签）、单边标记（单标记标签）.....
HTML入门（基础）
qq_74607190的博客
03-21 1666
HTML的基本入门
初学HTML详细全过程
m0_56364861的博客
04-21 3986
写的比较啰嗦，主要为了确保以后复习还能看懂。
HTML的基本用法——三分钟看完
weixin_68362857的博客
12-21 2213
html简单应用
响应式web中css文件怎么打开
最新发布
09-20
这里假设CSS文件名为`styles.css`，并且位于与HTML文件相同的目录下。 2. 使用媒体查询可以在CSS文件中编写针对不同设备屏幕大小的规则，例如： ```css /* 默认样式 */ body { font-size: 16px; } /* 当视口宽度...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值