HTML作业

最新推荐文章于 2024-06-26 09:35:57 发布
最新推荐文章于 2024-06-26 09:35:57 发布
阅读量407 收藏 3
点赞数 2
文章标签： html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_63890458/article/details/129400180
版权

1.制作如下页面在这里插入图片描述

代码呈现：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			p {
				line-height: 2.8em;
			}
		</style>
		
	</head>
	<body>
		<h1>
			将进酒
			<span style="font-size:28px;">君不见黄河之水天上来</span>
		</h1>
		
		<div>
			<img src="将进酒.png" alt="" style="float: left;" />
			<span style="float: left;" >
				<p>看不见黄河之水天上来，奔流到海不复回。</p>
				<p>君不见高堂明镜悲白发，朝如青丝暮成雪。</p>
				<p>人生得意须尽欢，莫使金樽空对月。</p>
				<p>天生我材必有用，千金散尽还复来。</p>
				<p>烹羊宰牛且为乐，会须一饮三百杯,</p>
				<p>岑夫子，丹丘生，将进酒，</p>
				<p>杯莫停与君歌一曲，请君为我侧耳听钟鼓惺玉不足贵，</p>
				<p>但愿长醉不复醒.古来圣贤皆我真，惟有饮者留其名。</p>
				<p>陈王昔时宴平乐，斗酒十千恣欢谑。</p>
				<p>主人何为言少钱，径须沽取对君酌五花马，</p>
				<p>干金袭呼儿将出换美酒，与尔同销万古愁。</p>
			</span>
		</div>
		
	</body>
</html>

网页效果呈现：
在这里插入图片描述

2.制作如下页面

在这里插入图片描述

代码呈现：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<heard>
			<h1>热门电影板块</h1>
		</heard>
		<hr/>
		<div>
			
			<span style="font-size: 20px;">
				<b>
				最近热门电影
				</b>
			</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">热门</span>
			&nbsp;&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">最新</span>
			&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">豆瓣高分</span>
			&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">冷门佳片</span>
			&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">华语</span>
			&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">欧美</span>
			&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">韩国</span>
			&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">日本</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span style="font-size: 20px;">更多&gt;&gt;</span>
		</div>
		<hr />
		<div>
			<img src="猜火车.png" alt="" />
			<img src="贝尔科实验.png" alt="" />
			<img src="加州公园巡警.png" alt="" />
			<img src="歌声不绝.png" alt="" />
		</div>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<div>
			<span>猜火车8.1</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;
			<span>贝尔科实验 6.0</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span>加州公路巡警 6.8</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span>歌声不绝 6.3</span>
			
		</div>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<div>
			<img src="明日的我与昨日的我.png" alt="" />
			<img src="速度与激情.png" alt="" />
			<img src="极速特工.png" alt="" />
			<img src="金刚狼3.png" alt="" />
		</div>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<div>
			<span>明日的我与昨日的我</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span>速度与激情8</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span>极速特工</span>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<span>金刚狼3 : 殊死一战</span>
		</div>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
	</body>
</html>

网页效果如下：
在这里插入图片描述

3.制作如下网页：

在这里插入图片描述
代码呈现：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<h1>工商银行电子汇款单</h1>
		<table border="1" cellspacing="0" cellpadding="1">
			<tr>
				<th colspan="2">回单类型</th>
				<!--<td></td>-->
				<td width="300px">网上转账汇款</td>
				<th colspan="2">指令序号</th>
				<!--<td></td>-->
				<td width="300px">HQH0000000000000013878172</td>
			</tr>
			<tr>
				<th rowspan="4" width="5px">收款人</th>
				<td>户名</td>
				<td>老牟</td>
				<td rowspan="4" width="5px">付款人</td>
				<td>户名</td>
				<td>老刘</td>
			</tr>
			<tr>
				<!--<th></th>-->
				<th>卡号</th>
				<td>000000000001</td>
				<!--<td></td>-->
				<td>卡号</td>
				<td>000000000002</td>
			</tr>
			<tr>
				<!--<th></th>-->
				<td>地区</td>
				<td>南京</td>
				<!--<td></td>-->
				<td>地区</td>
				<td>杭州</td>
			</tr>
			<tr>
				<!--<th></th>-->
				<td>网点</td>
				<td>工商江苏南京业务处理中心</td>
				<!--<td></td>-->
				<td>网点</td>
				<td>江苏徐州业务中心</td>
			</tr>
			<tr>
				<th colspan="2">币种</th>
				<!--<td></td>-->
				<td>人民币</td>
				<th colspan="2">钞汇标志</th>
				<!--<td></td>-->
				<td>钞票</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>2017年6月1日</td>
				<th colspan="2">时间戳</th>
				<!--<td></td>-->
				<td>2017-06-01-13.00.0。 00000</td>
			</tr>
			
		</table>
		&nbsp;
		&nbsp;
		<div>票据打印时间 : 2017-06-01 15:00:12</div>
		&nbsp;
		&nbsp;
		
		<div><del>票据打印单位:江苏徐州业务中心</del></div>
		&nbsp;
		&nbsp;
		
		<div>操作员: 大曾</div>
		&nbsp;
		&nbsp;
		
	</body>
</html>

网页效果呈现：
在这里插入图片描述

Vanilla-li
关注
html作业 当当图书榜
07-17
"html作业 当当图书榜" 这个标题表明了这是一个与HTML相关的学习项目，具体是模拟制作当当网上的图书排行榜页面。当当网是中国知名的在线图书销售平台，其图书榜通常会展示各类畅销书籍，包括但不限于小说、教辅、...
html 练习：展示一首古诗词
墨城烟柳ベ旧人殇的博客
03-31 2539
本文完成html语言的一个小练习，展示古诗词，从这个角度熟悉html语言。
学生HTML个人网页作业作品 HTML+CSS+JavaScript环保页面设计与实现制作
最新发布
网页设计与制作
06-26 277
🌲环境保护、🌳 保护地球、🌴 校园环保、🌵垃圾分类、🚵🏼绿色家园、等网站的设计与制作。⭐ 总结了一些学生网页制作的经验：一般的网页需要融入以下知识点：div+css布局、浮动、定位、高级css、表格、表单及验证、js轮播图、音频 视频 Flash的应用、ul li、下拉导航栏、鼠标划过效果等知识点，网页的风格主题也很全面：如爱好、风景、校园、美食、动漫、游戏、咖啡、音乐、家乡、电影、名人、商城以及个人主页等主题，学生、新手可参考下方页面的布局和设计和HTML源码（有用点赞△）🏅 一套A+的网
html作业
qq_45730029的博客
12-15 188
!DOCTYPE html> < html > < head > < meta charset=“utf-8” > < title>新浪 < style type=“text/css” > .h2{font: 24px 黑体; color: #FF0000; text-align: left; text-decoration: un...
前端练手
qq_51779101的博客
05-17 1433
华阴老腔介绍 主页和爱好者页注册 主页图片 主页代码： <!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=
HTML 作业
高筑墙，广积粮，缓称王
03-31 988
前言 本作业为当堂作业，时间为30分钟。一、题目要求 Buttons, ”add user”, ”edit” and “logout” are links, their url can be empty. Inputs, “Search type”, “search condition” and button “search” are within a form. “search type”
HTML作业-仿网易云音乐项目.rar
06-11
这个“HTML作业-仿网易云音乐项目”是一个学习项目，旨在帮助学生或者自学者掌握HTML的基本语法和实际应用，通过模仿网易云音乐的界面设计来提升网页布局和交互设计能力。 在HTML中，我们首先会接触到基本的元素...
HTML大作业源码
12-30
HTML大作业源码是针对初学者或学生设计的一组练习，旨在帮助他们深入理解HTML（超文本标记语言）的基本概念和应用。HTML是构建网页内容的基础，它定义了页面的结构和布局。在这个作业中，我们可以看到一系列的HTML...
html作业 仿京东商城登录界面
07-17
这是一个适合HTML初学者的课堂作业，旨在帮助学习者掌握基础的网页布局和样式设计技能。 首先，HTML（HyperText Markup Language）是用于创建网页内容的基础语言，它定义了网页的结构和意义。在这个作业中，学生...
我的HTML作业
07-30
这是我们的作业，老师发的，真正精华!主要是网页制作基础，适合初学者学习！
html大作业
12-30
html简单的网页设计，主题是传统文化，适用于初学者，内含文档和各个html、css文件
html 大作业
05-17
一个可以当做期末考核的作品,描述最喜爱的影视演员黄渤
简单大学生html作业
12-30
简单的大学生html课程作业。可以作为参考。
HTML期末作业模板5-15
05-15
"HTML期末作业模板5-15"可能是指一个系列的HTML作业模板，专为学生准备期末项目而设计，覆盖了从基础到进阶的多个知识点。 1. **HTML基本结构**：每个HTML文件都由`<!DOCTYPE html>`声明开头，表明文档类型，接着是...
HTML作业（一）
ll_j_21的博客
10-16 5959
一、 在这里插入代码片
我的 html作业
liubag的专栏
03-06 1234
我的  html作业
html css作业
qq_40859235的博客
07-29 6413
根据所给商品图片，做一个类似如下图所示的小米商城的页面 想法： 运用上课学的知识，我决定先建一个主盒子，再在主盒子中分左右两个盒子，右边的盒子再分上下两个盒子，里面的八个商品浮动加间距即可。 大致写出来是这个效果 &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt...
html作业源码分享
04-23
当然，我可以给你介绍一下HTML作业源码分享。HTML（Hypertext Markup Language）是一种用于创建网页的标记语言。下面是一个简单的HTML作业源码示例： ```html <!DOCTYPE html> <html> <head> <title>我的作业</title> </head> <body> <h1>欢迎来到我的作业页面</h1> <h2>作业一</h2> <p>这是我的第一个作业，内容如下：</p> <ul> <li>任务一：创建一个HTML页面</li> <li>任务二：添加标题和段落</li> <li>任务三：插入图片</li> </ul> <h2>作业二</h2> <p>这是我的第二个作业，内容如下：</p> <ul> <li>任务一：创建一个表格</li> <li>任务二：添加表头和表格数据</li> <li>任务三：设置表格样式</li> </ul> <h2>作业三</h2> <p>这是我的第三个作业，内容如下：</p> <ul> <li>任务一：创建一个表单</li> <li>任务二：添加输入框和按钮</li> <li>任务三：实现表单提交功能</li> </ul> </body> </html> ``` 这个示例展示了一个简单的HTML页面，包含了三个作业的内容。你可以根据自己的需要修改和扩展这个源码。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值