前言
💫你好，我是辰chen，一个正在考研途中的sophomore dog😖
💫本篇内容来源于对 AcWing-Web应用课的总结与复习，其内容来源于讲义与习题打卡，Web前端专栏地址：Web前端
💫欢迎大家的关注，我的博客主要关注于考研408以及AIoT的内容
以下的几个专栏是本人比较满意的专栏(大部分专栏仍在持续更新)，欢迎大家的关注：
💥ACM-ICPC算法汇总【基础篇】
💥ACM-ICPC算法汇总【提高篇】
💥AIoT(人工智能+物联网)
💥考研
💥CSP认证考试历年题解
建议在读本篇博客时，配合 vscode前端环境配置与html基础标签 食用，效果更佳！
第一题
编写一个完整的 HTML 页面。
要求
- 页面标签的标题为：
Web应用课作业 charset为：UTF-8keywords为：acwing,web,htmldescription为：本课程为【AcWing工程课系列——Level-3 第一篇】《Web应用课》，讲解Web相关知识。icon设置为：/images/logo.png
代码：
<!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=1.0"> <title>Web应用课作业</title> <meta name="keywords" content="acwing,web,html"> <meta name="description" content="本课程为【AcWing工程课系列——Level-3 第一篇】《Web应用课》，讲解Web相关知识。"> <link rel="icon" href="/images/logo.png"> </head> <body> </body> </html>
第二题
编写一个完整的HTML页面。
要求
页面从上到下的内容依次为：
- (1)
<h2>标题，内容为：春江花月夜。 - (2)
<h5>标题，内容为：张若虚。 - (3) 编写一个段落，内容为（注意标点和行末回车）：
春江潮水连海平，海上明月共潮生。 滟滟随波千万里，何处春江无月明！ 江流宛转绕芳甸，月照花林皆似霰； 空里流霜不觉飞，汀上白沙看不见。 江天一色无纤尘，皎皎空中孤月轮。 江畔何人初见月？江月何年初照人？ 人生代代无穷已，江月年年望相似。
- (4) 一个水平线
- (5) 一段代码，需要用预定义格式文本，内容为：
int main() { int a, b; scanf("%d%d", &a, &b); printf("%d %d\n", a, b); return 0; }
- (6) 编写一个段落，内容为：
春眠不觉晓，处处闻啼鸟。夜来风雨声，花落知多少。，第一句话用斜体（包括句末标点），第二句话加粗（包括句末标点），第三句话加删除线（包括句末标点），第四句话加下划线（包括句末标点）。
代码：
<!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=1.0"> <title>Document</title> </head> <body> <h2>春江花月夜</h2> <h5>张若虚</h5> <p> 春江潮水连海平，海上明月共潮生。<br> 滟滟随波千万里，何处春江无月明！<br> 江流宛转绕芳甸，月照花林皆似霰；<br> 空里流霜不觉飞，汀上白沙看不见。<br> 江天一色无纤尘，皎皎空中孤月轮。<br> 江畔何人初见月？江月何年初照人？<br> 人生代代无穷已，江月年年望相似。 </p> <hr> <pre> int main() { int a, b; scanf("%d%d", &a, &b); printf("%d %d\n", a, b); return 0; } </pre> <p> <i>春眠不觉晓，</i> <b>处处闻啼鸟。</b> <del>夜来风雨声，</del> <ins>花落知多少。</ins> </p> </body> </html>
第三题
编写一个完整的 HTML 页面。
要求
页面里包含一张图片，各个属性值为：
src为：/images/mountain.jpg。alt为：山。
width为：600
代码：
<!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=1.0"> <title>Document</title> </head> <body> <img width="600" src="/images/mountain.jpg" alt="山"> </body> </html>
第四题
编写一个完整的 HTML 页面。
要求
页面中包含一个音频和一个视频。
音频格式：
- 具有属性
controls。 src为：/audios/bgm.mp3。
视频格式：
- 具有属性
controls。 src为：/videos/video2.mp4。width为：600。
代码：
<!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=1.0"> <title>Document</title> </head> <body> <audio controls src="/audios/bgm.mp3"></audio> <video width="600" controls src="/videos/video2.mp4"></video> </body> </html>
第五题
编写一个完整的 HTML 页面。
要求
页面从上到下的内容依次为：
- 一个超链接，内容为：
About，跳转到/about.html，在当前页面中加载。 - 一个超链接，内容为一张图片，图片地址：
/images/logo.png，宽度为50px，alt为logo，跳转到：https://www.acwing.com，在新窗口中打开。
代码：
<!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=1.0"> <title>Document</title> </head> <body> <a href="/about.html">About</a> <a href="https://www.acwing.com" target="_blank"> <img width="50" src="/images/logo.png" alt="logo"> </a> </body> </html>
