关于HTML的实训作业

1.使用HTML实现下图效果:
关于HTML的实训作业_第1张图片

<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的实训作业_第2张图片

<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的实训作业_第3张图片

<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=图片路径">
" 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的实训作业_第4张图片

<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>

你可能感兴趣的:(html)