最新消息: USBMI致力于为网友们分享Windows、安卓、IOS等主流手机系统相关的资讯以及评测、同时提供相关教程、应用、软件下载等服务。

HTML5期末大作业:大学生抗疫感动专题网页——抗击疫情(5个页面) 抗击疫情网页制作作业 疫情防控网页设计HTML模板 大学生抗疫感动专题网页设计作业模板 静态HTML CSS网站制作成品

互联网 admin 3浏览 0评论

HTML5期末大作业:大学生抗疫感动专题网页——抗击疫情(5个页面) 抗击疫情网页制作作业 疫情防控网页设计HTML模板 大学生抗疫感动专题网页设计作业模板 静态HTML CSS网站制作成品

 

 

 

 

 

<!DOCTYPE html>
<html lang="zh">

<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">
    <script src="js/js.js" type="text/javascript" charset="utf-8"></script>

    <link rel="stylesheet" href="css/style.css">
    <title>抗疫</title>
</head>

<body>
    <style>
        @-webkit-keyframes myfirst {
            0% {
                left: 0px;
                top: 0px;
            }

            25% {
                left: 850px;
                top: 0px;
            }

            50% {
                left: 850px;
                top: 300px;
            }

            75% {
                left: 0px;
                top: 300px;
            }

            100% {
                left: 0px;
                top: 0px;
            }
        }
    </style>

    <div style="position: relative;width: 1000px;margin: 0 auto;">
        <div class="main">
            <div class="banner">
                <!-- 轮播图开始 -->
                <div id="boxhdp">
                    <img src="imgs/lunbo1.png">
                </div>

            </div>
        </div>
        <div class="heard">
            <div class="nav">
                <a href="./index.html">本站首页</a>
                <a href="./page1.html">抗疫先锋</a>
                <a href="./page2.html">房舱医院</a>
                <a href="./page3.html">疫情状况</a>
                <a href="./login.html">招贤纳士</a>
            </div>
        </div>
        <div class="banner_box">
            <div class="banner_t">
                <img id="zz" src="./imgs/banner.jpg" alt="">
                <script>
                    var zz = document.getElementById('zz');
                    var i = 0;
                    setInterval(function () {
                        if (i == 0) {
                            zz.src = "imgs/a.jpg"
                            i = 1;
                        } else if (i == 1) {
                            zz.src = "imgs/c.jpg"
                            i = 2
                        } else if (i == 2) {
                            zz.src = "imgs/banner.jpg"
                            i = 0
                        }
                    }, 2000)
                </script>
            </div>
        </div>

        <div class="main_neirong">
            <div class="top_box">
                <div class="avatar">
                    <img src="./imgs/avatar.jpg" alt="">
                </div>
                <div class="msg">
                    <p class="name">钟南山</p>
                    <p class="txt">钟南山院士长期从事呼吸内科的医疗、教学、科研工作。重点开展哮喘,慢阻肺疾病,呼吸衰竭和呼吸系统常见疾病的规范化诊疗、疑难病、少见病和呼吸危重症监护与救治等方面的研究。
                        [54] 并首次证实了隐匿型哮喘的存在。他所领导的研究所对慢性不明原因咳嗽诊断成功率达85%,重症监护室抢救成功率达91%</p>

                </div>
                <div class="news">
                    <div class="title">
                        感人的抗疫事迹
                    </div>
                    <ul class="list">
                        <li class="item">
                            <span>星火燎原——他们的抗疫故事...
                             </span>
                            <span>2022/06/02 </span>
                        </li>
                        <li class="item">
                            <span>英雄故事:白衣天使,抗疫英雄...</span>
                            <span>2022/06/01 </span>
                        </li>
                        <li class="item">
                            <span>天桥抗疫故事:冲在一线的最美“橙”墙...</span>
                            <span>2022/06/O1 </span>
                        </li>
                        <li class="item">
                            <span>下沉故事——韩冰姝:抗疫有我...</span>
                            <span>2022/05/031 </span>
                        </li>
                        <li class="item">
                            <span>抗疫最美故事:最美的守护,是与你并肩作战...</span>
                            <span>2022/05/31 </span>
                        </li>
                        <li class="item">
                            <span>他们,擎起首都的天空——来自北京的"凡人"抗疫故事...</span>
                            <span>2022/05/30 </span>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="bottom_list">
                <ul class="list">
                    <div class="title">
                        抗疫最新动态
                    </div>
                    <ul class="list">
                        <li class="item">
                            <span>感染者呈每日下降态势,北京13个区恢复正常生产生活...</span>
                            <span>2022/06/02 </span>
                        </li>
                        <li class="item">
                            <span>坚持露头就打,推进动态清零行动!蔡奇到昌平区检查疫情处置...</span>
                            <span>2022/06/02 </span>
                        </li>
                        <li class="item">
                            <span>浙江省防控办最新通知:高效统筹疫情防控和餐饮旅游等服务业发展...</span>
                            <span>2022/06/01 </span>
                        </li>
                        <li class="item">
                            <span>刚刚,黑龙江疫情又有了新的消息0增...</span>
                            <span>2022/06/01 </span>
                        </li>
                        <li class="item">
                            <span>合力共织防护网,"动态清零"战疫情...</span>
                            <span>2022/05/31 </span>
                        </li>
                        <li class="item">
                            <span>山东连续14天无本土新增...</span>
                            <span>2017/09/11 </span>
                        </li>
                    </ul>
                </ul>
                <ul class="list">
                    <div class="title">
                        抗疫视频
                    </div>
                    <div class="audio_box">
                        <video class="audio_box" controls>
                            <source src="./imgs/video2.mp4" type="video/mp4">
                            <source src="./imgs/video2.avi" type="video/avi">
                        </video>
                    </div>
                    
                </ul>

            </div>


        </div>
        <div class="clear">

        </div>
        <div class="footer">
            <a href="./login.html">招贤纳士</a>
        </div>
    </div>

</body>

</html>


 

源码地址:y/#/details?munber=YL1653040110471

HTML5期末大作业:大学生抗疫感动专题网页——抗击疫情(5个页面) 抗击疫情网页制作作业 疫情防控网页设计HTML模板 大学生抗疫感动专题网页设计作业模板 静态HTML CSS网站制作成品

 

 

 

 

 

<!DOCTYPE html>
<html lang="zh">

<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">
    <script src="js/js.js" type="text/javascript" charset="utf-8"></script>

    <link rel="stylesheet" href="css/style.css">
    <title>抗疫</title>
</head>

<body>
    <style>
        @-webkit-keyframes myfirst {
            0% {
                left: 0px;
                top: 0px;
            }

            25% {
                left: 850px;
                top: 0px;
            }

            50% {
                left: 850px;
                top: 300px;
            }

            75% {
                left: 0px;
                top: 300px;
            }

            100% {
                left: 0px;
                top: 0px;
            }
        }
    </style>

    <div style="position: relative;width: 1000px;margin: 0 auto;">
        <div class="main">
            <div class="banner">
                <!-- 轮播图开始 -->
                <div id="boxhdp">
                    <img src="imgs/lunbo1.png">
                </div>

            </div>
        </div>
        <div class="heard">
            <div class="nav">
                <a href="./index.html">本站首页</a>
                <a href="./page1.html">抗疫先锋</a>
                <a href="./page2.html">房舱医院</a>
                <a href="./page3.html">疫情状况</a>
                <a href="./login.html">招贤纳士</a>
            </div>
        </div>
        <div class="banner_box">
            <div class="banner_t">
                <img id="zz" src="./imgs/banner.jpg" alt="">
                <script>
                    var zz = document.getElementById('zz');
                    var i = 0;
                    setInterval(function () {
                        if (i == 0) {
                            zz.src = "imgs/a.jpg"
                            i = 1;
                        } else if (i == 1) {
                            zz.src = "imgs/c.jpg"
                            i = 2
                        } else if (i == 2) {
                            zz.src = "imgs/banner.jpg"
                            i = 0
                        }
                    }, 2000)
                </script>
            </div>
        </div>

        <div class="main_neirong">
            <div class="top_box">
                <div class="avatar">
                    <img src="./imgs/avatar.jpg" alt="">
                </div>
                <div class="msg">
                    <p class="name">钟南山</p>
                    <p class="txt">钟南山院士长期从事呼吸内科的医疗、教学、科研工作。重点开展哮喘,慢阻肺疾病,呼吸衰竭和呼吸系统常见疾病的规范化诊疗、疑难病、少见病和呼吸危重症监护与救治等方面的研究。
                        [54] 并首次证实了隐匿型哮喘的存在。他所领导的研究所对慢性不明原因咳嗽诊断成功率达85%,重症监护室抢救成功率达91%</p>

                </div>
                <div class="news">
                    <div class="title">
                        感人的抗疫事迹
                    </div>
                    <ul class="list">
                        <li class="item">
                            <span>星火燎原——他们的抗疫故事...
                             </span>
                            <span>2022/06/02 </span>
                        </li>
                        <li class="item">
                            <span>英雄故事:白衣天使,抗疫英雄...</span>
                            <span>2022/06/01 </span>
                        </li>
                        <li class="item">
                            <span>天桥抗疫故事:冲在一线的最美“橙”墙...</span>
                            <span>2022/06/O1 </span>
                        </li>
                        <li class="item">
                            <span>下沉故事——韩冰姝:抗疫有我...</span>
                            <span>2022/05/031 </span>
                        </li>
                        <li class="item">
                            <span>抗疫最美故事:最美的守护,是与你并肩作战...</span>
                            <span>2022/05/31 </span>
                        </li>
                        <li class="item">
                            <span>他们,擎起首都的天空——来自北京的"凡人"抗疫故事...</span>
                            <span>2022/05/30 </span>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="bottom_list">
                <ul class="list">
                    <div class="title">
                        抗疫最新动态
                    </div>
                    <ul class="list">
                        <li class="item">
                            <span>感染者呈每日下降态势,北京13个区恢复正常生产生活...</span>
                            <span>2022/06/02 </span>
                        </li>
                        <li class="item">
                            <span>坚持露头就打,推进动态清零行动!蔡奇到昌平区检查疫情处置...</span>
                            <span>2022/06/02 </span>
                        </li>
                        <li class="item">
                            <span>浙江省防控办最新通知:高效统筹疫情防控和餐饮旅游等服务业发展...</span>
                            <span>2022/06/01 </span>
                        </li>
                        <li class="item">
                            <span>刚刚,黑龙江疫情又有了新的消息0增...</span>
                            <span>2022/06/01 </span>
                        </li>
                        <li class="item">
                            <span>合力共织防护网,"动态清零"战疫情...</span>
                            <span>2022/05/31 </span>
                        </li>
                        <li class="item">
                            <span>山东连续14天无本土新增...</span>
                            <span>2017/09/11 </span>
                        </li>
                    </ul>
                </ul>
                <ul class="list">
                    <div class="title">
                        抗疫视频
                    </div>
                    <div class="audio_box">
                        <video class="audio_box" controls>
                            <source src="./imgs/video2.mp4" type="video/mp4">
                            <source src="./imgs/video2.avi" type="video/avi">
                        </video>
                    </div>
                    
                </ul>

            </div>


        </div>
        <div class="clear">

        </div>
        <div class="footer">
            <a href="./login.html">招贤纳士</a>
        </div>
    </div>

</body>

</html>


 

源码地址:y/#/details?munber=YL1653040110471

发布评论

评论列表 (0)

  1. 暂无评论