静态HTML+CSS 中国高等教育学生信息网（学信网）网站

m0_70870089

已于 2022-07-04 14:55:09 修改

阅读量3.4k

点赞数 1

文章标签：大数据

于 2022-07-02 10:44:21 首次发布

本文链接：https://blog.csdn.net/m0_70870089/article/details/125570172

版权

本文介绍如何利用静态HTML和CSS技术，详细解析并实现中国高等教育学生信息网（学信网）的网页布局和设计。通过实例展示如何构建网页结构，应用CSS样式，以达到与学信网相似的视觉效果。

摘要由CSDN通过智能技术生成

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学信网</title>
    <!-- 以下是引入外部文件 -->
    <link rel="stylesheet" href="./CSS/.css" type="text/css">
</head>

<body>
    <div class="shou"></div>
    <div class="header wrapper">
        <p>为落实肺炎疫情防控工作要求，2月3日-21日停止办理现场咨询和电话咨询，请至学信网微信公众号(chsi_chesicc)在线咨询或
            <a href="#">发邮件</a>。
        </p>
        <div class="nav">
            <ul>
                <li><a href="#" class="noe">首页</a></li>
                <li><a href="#" class="title">网址导航</a></li>
                <li><a href="#" class="title">教育网</a></li>
                <li><a href="#" class="title">English</a></li>
            </ul>

        </div>
    </div>
    <div class="banner wrapper">
        <div class="box">
            <a href="#"><img src="./images/02.png" s alt="pc1" width="90px" height="65px" class="pc1"></a>
            <ul>
                <li>
                    <h2>中国高等教育学生信息网（学信网）</h2>
                    <p>教育部学历查询网站、教育部高校招生阳光工程指定网站、全国硕士研究生招生报名和调剂指定网站</p>
                </li>
            </ul>
        </div>
        <div class="goods">
            <ul>
                <li>
                    <a href="#">首页</a>
                    <a href="#">学籍查询</a>
                    <a href="#">学历查询</a>
                    <a href="#">在线验证</a>
                    <a href="#">出国教育背景服务</a>
                    <a href="#">图像校对</a>
                    <a href="#">学信档案</a>
                    <a href="#">高考考研</a>
                    <a href="#">政法招生</a>
                    <a href="#">港澳台招生</a>
                    <a href="#">四六级查分</a>
                    <a href="#">征兵</a>
                    <a href="#">就业</a>
                    <a href="#">学职平台</a>
                    <a href="#">日本频道</a>
                </li>
            </ul>

        </div>
        <div class="left">
            <div class="nav">
                <div class="tou">
                    <a href="#"> <img src="./images/04.png" alt=""></a>
                </div>
                <div class="shen1">
                    <div class="shen">
                        <ul>
                            <li>
                                <a href="#">
                                    <h3>要闻</h3>
                                </a>
                                <a href="#">
                                    <p>专题汇总</p>
                                </a>
                                <a href="#">
                                    <p>|</p>
                                </a>
                                <a href="#">
                                    <p>更多新闻</p>
                                </a>
                            </li>
                        </ul>
                    </div>
                    <div class="shen2">
                        <ul>
                            <li>
                                <a href="#">
                                    <h2>2020年考研分数查询及复试分数线汇总</h2>
                                </a>
                                <a href="#">
                                    <p>教育部：合理调整研究生考试招生近期工作安排</p>
                                </a>
                                <a href="#" class="hou">
                                    <p>考研复试、高考是否会推迟？教育部官方回应</p>
                                </a>
                                <a href="#">
                                    <h6>..............................................................................................................................................</h6>
                                    <br></a>
                                <a href="#">
                                    <h3>应对新冠肺炎疫情 调整招考政策 教育系统在行动</h3>
                                </a>
                                <a href="#">
                                    <p>公告：取消高等教育学历认证收费及调整认证受理范围</p>
                                </a>
                                <a href="#">
                                    <p> 学信网招聘 | 新媒体矩阵 | <span class="te">特别提醒 |</span>【新闻】 </p>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="shen3">
                    <div class="shen4">
                        <ul>
                            <li>
                                <a href="#&