关于HTML的实训作业

最新推荐文章于 2024-06-12 10:36:38 发布

一只蹦跶的小蹦跶

最新推荐文章于 2024-06-12 10:36:38 发布

阅读量3k

点赞数 4

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/zf_14159265358979/article/details/105252387

版权

html 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1.使用HTML实现下图效果：
在这里插入图片描述

<head>
<meta charset="UTF-8">
<title>html课后作业</title>
</head>
<body>
<p>针对下面这个一元二次方程</p><br>
<p>x²-<b>5</b>x+<b>4</b>=0</p><br>
<p>我们使用<b>分解因式法</b>来演示解题思路如下:</p><br>
<p>由: (x-1)(x-4)=0</p><br>
得:<br>
X₁=1<br>
X₂=4
</body>
</html>

2.使用标题标签和段落标签制作李白的诗《望庐山瀑布》，诗正文字体颜色为绿色，字体大小为14px。如下图所示：
在这里插入图片描述

<html>
<head>
<meta charset="UTF-8">
<title>李白的诗《望庐山瀑布》</title>
</head>
<body>
<h2>望庐山瀑布</h2>
<p style="font-size:14px"><font color="green">日照香炉生紫烟,<br>
遥看瀑布挂前川。<br>
飞流直下三千尺，<br>
疑是银河落九天。</font></p>
</body>
</html>

3.标题颜色为红色，字体大小为18px；正文的第一段内容，字体大小为12px，字体颜色为红色，第二段字体颜色为黑色，字体大小为12px。如下图所示：
在这里插入图片描述

<html>
<head>
<meta charset="UTF-8">
<title>《水调歌头》</title>
</head>
<body>
<p style="font-size:18px"><font color="red">水调歌头</font></p>
<hr />
<p style="font-size:12px"><font color="red">明白几时有，把酒问青天。<br>
不知天上宫阙，今夕是何年？<br>
我欲乘风归去，又恐琼楼玉宇，<br>
高处不胜寒。<br>
起舞弄清影，何似在人间！</font></p><br>
<p style="font-size:12px"><font color="black">转朱阁，低绮户，照无眠。<br>
不应有恨，何事长向别时圆？<br>
人有悲欢离合，月有阴晴圆缺，<br>
此事古难全。<br>
但愿人长久，千里共婵娟。</font></p>
</body>
</html>

4.建立html文件文件名称为“1.html”。
具体要求设置网页背景颜色为蓝色。网页标
题为“欢迎您来到济宁慧与基地”。
正文段落内容为：
HTML
开发2班
欢迎您的到来！

字体楷体
字号 7号
颜色红色
加粗并加下划线

<html>
<head>
<meta charset="UTF-8">
<title>欢迎您来到济宁慧与基地</title>
</head>
<body style="background-color:blue">
<p style="font-family:KaiTi"><strong><font size="7" color="red">HTML<br>
开发2班 <br>
欢迎您的到来！</font></strong></u></p>
</body>
</html>

5.建立html文件文件名称为“3.html”。
具体要求设置网页网页标题为“图片超链接的设置”。在网页中插入一副图片(图片任意采取相对路径),并设置该图片的边框粗细为5像素高度为200像素宽度为200像素图片提示文字为“您插的是什么图片呢”。为该图片设置超链接链接的内容也为一副图片（图片任意采取相对路径）。

<html>
<head>
<meta charset="UTF-8">
<title>图片超链接的设置</title>
</head>
<body>
<p>您插的是什么图片呢</p><br>
<a herf=图片路径"></a>
<img src="图片路径" border="5px" width="200px" height="200px" />
</body>
</html>

6.建立html文件文件名称为“2.html”。
具体要求设置网页网页标题为“有序列表的建立”。建立如下图所示的有序列表有序列表的标号为“A”。内容效果如下：

本学期所学课程如下：
A. JAVA基础
B. MySQL
C. HTML
D. Css
E. JavaScript
F. jQuery
G. Javaweb
H.Bootstrap
I. SSH框架

<html>
<head>
<meta charset="UTF-8">
<title>有序列表的建立</title>
</head>
<body>
<h4>本学期所学课程如下：</h4>
<ol type="A">
 <li>JAVA基础</li>
 <li>MySQL</li>
 <li>HTML</li>
 <li>Css</li>
 <li>JavaScript</li>
 <li>jQuery</li>
 <li>Javaweb</li>
 <li>Bootstrap</li>
 <li>SSH框架</li>
</ol>
</body>
</html>

7.建立一个表格，效果如下：。
在这里插入图片描述

<html>
<head>
<meta charset="UTF-8">
<title>表格</title>
</head>
<body>
<h4 align="center">年终工资报表</h4>  
<table border="1" align="center">
<tr bgcolor="green">
  <td>区域办事处</td>
  <td>岗位</td>
  <td>姓名</td>
  <td>工资（RMB）</td>
</tr>   
<tr bgcolor="yellow">
  <th rowspan="3">华东区</th>
  <th rowspan="2">人事专员</th>
  <td>张民</td>
  <td>1500</td>
</tr>
<tr bgcolor="yellow">
  <td>王红</td>
  <td>1500</td>
</tr>
<tr bgcolor="yellow">
  <th rowspan="3">软件开发工程师</th>
  <td>李元凯</td>
  <td>6000</td>
</tr>
<tr bgcolor="yellow">
  <th rowspan="2">中南区</th>
  <td>杨涛</td>
  <td>5000</td>
</tr>
<tr bgcolor="yellow">
  <td>粮草</td>
  <td>1500</td>
</tr>
<tr bgcolor="red">
  <th colspan="3">总计</th>
  <td>19000</td>
</tr>
</table>
</body>
</html>

一只蹦跶的小蹦跶

关注

4
点赞
踩
12

收藏

觉得还不错? 一键收藏
0
评论
关于HTML的实训作业

1.使用HTML实现下图效果：<head><meta charset="UTF-8"><title>html课后作业</title></head><body>针对下面这个一元二次方程 x²-5x+&l...
复制链接

扫一扫

专栏目录