HTML+CSS大作业: 抗击疫情网页制作作业_疫情防控网页设计模板HTML_ 简单学生网页设计_静态HTML+CSS网站制作成品

临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没有合适的模板?等等一系列问题。你想要解决的问题,在这篇博文中基本都能满足你的需求~

原始HTML+CSS+JS页面设计, web大学生网页设计作业源码,这是一个不错的网页制作,画面精明,非常适合初学者学习使用。

作品介绍

​1.网页作品简介方面​​ :抗击疫情网页制作作品采用DIV CSS布局制作,网页共5个页面:​​首页、疫情数据、发现经过、传播途径、防护指南​​。网页制作采用学生基础水平设计,代码简单。

​2.网页作品编辑方面​​:此作品为学生个人主页网页设计题材,代码为简单学生水平 html+css 布局制作,作品下载后可使用任意HTML编辑软件(例如:​​DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm​​ 所有编辑器均可使用)

​3.网页作品布局方面​​:顶部BANNER大图为100%自适应屏幕宽度,网页主体内容区宽度为1200PX,设计方面使用CSS设计了网页背景颜色、导航鼠标经过变色、导航分割线等。

文章目录

  • ​​HTML+CSS大作业: 抗击疫情网页制作作业_疫情防控网页设计模板HTML_ 简单学生网页设计_静态HTML+CSS网站制作成品​​
  • ​​作品介绍​​
  • ​​1.作品首页​​
  • ​​三、代码实现​​
  • ​​四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)​​
  • ​​五、????????????????????????更多源码????????????????????????​​

1.作品首页

三、代码实现

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>疫情记忆</title>
<link href="css/style.css" rel="stylesheet" />
<link href="css/slideshow.css" rel="stylesheet" />
</head>

<body>
<div id="top">
<div id="above">
<div id="Logo"><a href="index.html"><img src="images/logo.png" width="180" height="50"></a></div>
<div id="search">
<label for="textfield"></label>
<input name="textfield" type="text" id="textfield" value=" 搜索" maxlength="15">
</div>
<div id="login"><a href="login.html">注册账号</a></div>
</div>
</div>
<!-- 导航条代码 开始 -->
<div class="nav">
<ul class="list">
<li><a href="index.html">首页</a></li>
<li><a href="#">疫情记忆 <img src="images/down.svg" alt="" width="12" height="12"></a>
<div class="down"> <a href="article.html"> 人物</a> <a href="page.html"> 城市</a> <a href="list.html"> 世界</a></div>
</li>
<li><a href="photo.html">相关图库</a></li>
<li><a href="login.html">注册/登录</a><a href="about.html"></a></li>
</ul>
</div>
<!-- 导航条代码 结束 -->
<div id="main-960">
<!-- 代码 开始 -->
<div id="yc-mod-slider">
<div class="wrapper">
<div id="slideshow" class="box_skitter fn-clear">
<ul>
<li>
<img class="cubeRandom" src="images/slider1.jpg" /></li>
<li>
<img class="cubeRandom" src="images/slider2.jpg" /></li>
<li>
<img class="cubeRandom" src="images/slider3.jpg" /></li>
<li>
<img class="cubeRandom" src="images/slider4.jpg" /></li>
<li>
<img class="cubeRandom" src="images/slider5.jpg" /></li>
</ul>
</div>
<script type="text/javascript" src="js/slideshow.js"></script>
</div>
</div>
<!-- 代码 结束 -->
<div id="aright">
<div id="atishi">勠力同心 勇往直前</div>
</div>
<div id="aright2">
<div id="image104"><a href="#"><img src="images/sf01.jpg" width="219" height="104"></a></div>

<div id="image104"><a href="#"><img src="images/sf02.jpg" width="219" height="104"></a></div>
</div>
</div>
<div id="im01">
<div id="text002">新型冠状病毒肺炎(Corona Virus Disease 2019,COVID-19),简称“新冠肺炎”,世界卫生组织命名为“2019冠状病毒病” [1-2] ,是指2019新型冠状病毒感染导致的肺炎。2019年12月以来,湖北省武汉市部分医院陆续发现了多例有华南海鲜市场暴露史的不明原因肺炎病例,证实为2019新型冠状病毒感染引起的急性呼吸道传染病。</div>
<div id="anniu" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="page.html">观看视频</a></div>
<div id="anniu1" class="d_out" onmouseover="this.className='d_over'" onmouseout="this.className='d_out'"><a href="list.html">了解更多</a></div>
</div>
<div class="div_first">
<div class="div_second">
<img src="images/slider01.jpg" alt=""><img src="images/slider02.jpg" alt=""><img src="images/slider03.jpg" alt=""><img src="images/slider04.jpg" alt="">
</div>
</div>
<div id="main-more"><table width="100%" height="318" border="0">
<tr>
<td align="left"><a href="article.html"><img src="images/renwu.jpg" width="308" height="307"></a></td>
<td align="center"><a href="page.html"><img src="images/chengshi.jpg" width="308" height="307"></a></td>
<td align="right"><a href="list.html"><img src="images/shijie.jpg" width="308" height="307"></a></td>
</tr>
</table>
</div>

<div id="music"><table width="100%" border="0">
<tr>
<td width="38%" height="55" align="center"><audio src="media/music.mp3" controls autoplay></audio></td>
<td width="62%"><marquee>君をのせて (天空の城ラピュタ)</marquee></td>
</tr>
</table>
</div>

<!-- footer代码 开始 -->
<footer>
<div id="footer_all">
<div id="f1170-167">
<div id="logo-175-40"><a href="index.html"><img src="images/logo.png" width="180" /></a></div>
<div class="aye" id="login">
<table width="103" border="0">
<tr>
<td width="97" height="37" align="left"><a href="http://www.psdhtml/index.php?c=thread&fid=18?yqjy" class="ayahei">了解更多</a></td>
</tr>
</table>
</div>

<div class="aye" id="login">
<table width="103" border="0">
<tr>
<td width="97" height="37" align="left"><span class="ayahei"><a href="login.html">注册账号</a></span><a href="Login.html"></a></td>
</tr>
</table>
</div>

<div id="right828-167">
<div id="l-828-80">
<div id="r-150-42"><a href="#"><img src="images/fb.png" width="45" height="45"></a></div>
<div id="r-150-42-1"><a href="#"><img src="images/tw.png" alt="" width="45" height="45"></a></div>
<div id="r-150-42-1"><a href="#"><img src="images/ins.png" alt="" width="45" height="45"></a></div>
</div>
<div id="r-lianjie"><table width="100%" border="0">
<tr>
<td align="right">© 疫情记忆&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;</td>
</tr>
</table>
</div>
</div>
</div>
<div id="banquan"><a href="http://www.psdhtml/index.php?c=thread&fid=18?ym" target="_blank"><img src="images/lxidw7.svg" width="1000" height="36"></a></div>
</div>
</footer>
<!-- 代码 结束 -->
</body>
</html>

四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)

​web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)​

适合入门到高级的童鞋们入手~​​送1000套HTML+CSS+JavaScript模板网站​


五、????????????????????????更多源码????????????????????????

更多推荐

HTML+CSS大作业: 抗击疫情网页制作作业_疫情防控网页设计模板HTML_ 简单学生网页设_静态HTML+CSS网站制作成品...