教务管理系统示例——前端模板

应某位小妹妹 要求设计的教务管理系统  花了三天时间  。有任何想法可与博主沟通哈。

访问链接  : 教务管理

功能模块:

        网站首页:轮播图、综合新闻、通知公告、卓越教师、教育教学

        课程列表:语文、数学、外语、兴趣课、以及价格分类

        优秀学生:信息介绍

        论坛

        通知公告

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <script src="js/swiper.min.js"></script>
        <script src='js/jquery-1.10.1.min.js'></script>
        <script src='js/clamp.min.js'></script>
        <link rel="stylesheet" href='css/main.css'>
        <link rel="stylesheet" href="css/swiper.css">
        <link rel='stylesheet' href='css/animate.self.css'>
        <link rel="stylesheet" href="css/font.css">
        <link rel="stylesheet" href="css/banner.css">
        <link rel="stylesheet" href="css/news_notice.css">
        <link rel="stylesheet" href="css/exhibition.css">
        <link rel="stylesheet" href="css/education_school.css">
        <link rel="stylesheet" href="css/foot.css">
        <link rel="stylesheet" href="css/index.css">
    </head>
    
    <body>
        <div id='index'>
            <div class='banner'>
                <ul class='nav_main'>
                    <li class='nav_list'>
                        <div class='nav_list_txt active'>
                            <p>网站首页</p>
                        </div>
                    </li>
                    <li class='nav_list'>
                        <div class='nav_list_txt' onclick='routerGo("course.html")'>
                            <p>课程列表</p>
                        </div>
                    </li>
                    <li class='nav_list'>
                        <div class='nav_list_txt' onclick='routerGo("student.html")'>
                            <p>优秀学生</p>
                        </div>
                    </li>
                    <li class='nav_list'>
                        <div class='nav_list_txt' onclick='routerGo("forum.html")'>
                            <p>论坛</p>
                        </div>
                    </li>
                    <li class='nav_list'>
                        <div class='nav_list_txt' onclick='routerGo("notice.html")'>
                            <p>通知公告</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class='main'>
                <div class='swipe'>
                    <div class="swiper-container swiper-container1">
                      <div class="swiper-wrapper">
                        <div class="swiper-slide swiper-no-swiping">
                            <img src="resource/swipe.jpg">
                        </div>
                        <div class="swiper-slide swiper-no-swiping">
                            <img src="resource/swipe.jpg">
                        </div>
                        <div class="swiper-slide swiper-no-swiping">
                            <img src="resource/swipe.jpg">
                        </div>
                      </div>
                    </div>
                    <div class="pagination"></div>
                </div>
                <div class='news_notice'>
                    <div class='centerbox'>
                        <div class='news load'>
                            <div class='news_btn_box'>
                                <div class="left"><img src="resource/left.png"></div> 
                                <div class="right"><img src="resource/right.png"></div>    
                            </div>                            
                            <div class='title'>
                                <div class='title_left'>
                                    <span class='title_left_cn'>综合新闻</span>
                                    <span class='title_left_en'>News</span>
                                </div>
                                <div class='title_right' onclick="routerGo('notice.html')">
                                    <span>更多>></span>
                                </div>    
                            </div>
                            <div class='swiper-container swiper-container2'>
                                <div class='swiper-wrapper'>
                                    <div class='swiper-slide swiper-no-swiping'>
                                        <div class='news_info'>
                                            <div class='news_pic_box'>
                                                <img class='animated' src="resource/news1.jpg">
                                            </div>
                                            <p class='news_info_title'>组织学生参加彩虹农庄活动</p>
                                            <p class='news_info_txt'>组织学生参加彩虹农庄活动组织学生参加彩虹农庄活动</p>
                                            <div class='news_info_msg'>
                                                <span>2016-07-10</span>
                                                <span>12:50</span>
                                                <span>|</span>
                                                <span>编辑:小丽</span>
                                            </div>
                                        </div>
                                    </div>    
                                    <div class='swiper-slide swiper-no-swiping'>
                                        <div class='news_info'>
                                            <div class='news_pic_box'>
                                                <img src="resource/news2.jpg">
                                            </div>
                                            <p class='news_info_title'>学生欢乐采摘</p>
                                            <p class='news_info_txt'>五一期间学校组织学生参加采摘体验劳动,帮助农民伯伯收摘西红柿</p>
                                            <div class='news_info_msg'>
                                                <span>2016-07-10</span>
                                                <span>12:50</span>
                                                <span>|</span>
                                                <span>编辑:小丽</span>
                                            </div>
                                        </div>
                                    </div> 
                                    <div class='swiper-slide swiper-no-swiping'>
                                        <div class='news_info'>
                                            <div class='news_pic_box'>
                                                <img src="resource/news3.jpg">
                                            </div>
                                            <p class='news_info_title'>集体唱歌,欢乐多多</p>
                                            <p class='news_info_txt'>学前班的小朋友在户外游玩,休息期间在老师的带领下一起唱歌,小朋友很开心学前班的小朋友在户外游玩,休息期间在老师的带领下一起唱歌,小朋友很开心学前班的小朋友在户外游玩,休息期间在老师的带领下一起唱歌,小朋友很开心</p>
                                            <div class='news_info_msg'>
                                                <span>2016-07-10</span>
                                                <span>12:50</span>
                                                <span>|</span>
                                                <span>编辑:小丽</span>
                                            </div>
                                        </div>
                                    </div>                        
                                </div>    
                            </div>
                        </div>
                        <div class='notice load'>
                            <div class='noticebox'>
                                <div class='title'>
                                    <div class='title_left'>
                                        <span class='title_left_cn'>通知公告</span>
                                        <span class='title_left_en'>Notice</span>
                                    </div>
                                    <div class='title_right' onclick="routerGo('notice.html')">
                                        <span>更多>></span>
                                    </div>    
                                </div>
                                <ul class='notice_info'>
                                    <li style='padding-top:0;'><span>[2017-02-10]</span>网站即将正式运营通知!</li>
                                    <li><span>[2016-08-10]</span>K学前班秋季招生需要注意事项!</li>
                                    <li><span>[2016-08-10]</span>K学前班秋季招生需要注意事项!</li>
                                    <li style='border:none'><span>[2016-07-15]</span>专门为K学前班特制的午餐食谱搭配</li>
                                </ul>    
                            </div>
                        </div>
                    </div>
                </div>    
                <div class='exhibition'>
                    <div class='centerbox'>
                        <div class='box_title'>
                            <div class='title yahei'>
                                <span class='title_cn'>卓越教师</span>
                                <span class='title_en'>Teachers</span>
                            </div>
                        </div>
                        <div class='load'>
                            <ul class='exhibition_menu yahei'>
                                <li>
                                    <div class='exhibitionLi ischoose'>
                                        <p class='menu_cn'>幼儿园</p>
                                        <p class='menu_en'>kindergarden</p>
                                    </div>
                                </li>
                                <li>
                                    <div class='exhibitionLi'>
                                        <p class='menu_cn'>小学</p>
                                        <p class='menu_en'>kindergarden</p>
                                    </div>
                                    
                                </li>
                                <li>
                                    <div class='exhibitionLi'>
                                        <p class='menu_cn'>初中</p>
                                        <p class='menu_en'>kindergarden</p>
                                    </div>                                
                                </li>
                                <li>
                                    <div class='exhibitionLi'>
                                        <p class='menu_cn'>高中</p>
                                        <p class='menu_en'>kindergarden</p>
                                    </div>                                
                                </li>
                            </ul>
                            <div class='exhibition_info'>
                                <div class="exhibition_info_left"><img src="resource/left1.png"></div> 
                                <div class="exhibition_info_right"><img src="resource/right1.png"></div> 
                                <div class='swiper-container swiper-container3'>
                                    <div class='swiper-wrapper'>
                                        <div class='swiper-slide swiper-no-swiping'>
                                            <div class='exhibition_box'>
                                                <div class='exhibition_pic_box'>
                                                    <img src="resource/teacher1.jpg">
                                                    <div class='exhibition_info_title'></div>
                                                    <div class='exhibition_info_title_box yahei'>
                                                        <p>王小丽</p>
                                                        <p>2年1班数学老师</p>
                                                    </div>
                                                    <div class='exhibition_info_detail'>
                                                        <p class='detail_name yahei'>王小丽</p>
                                                        <p class='detail_class yahei'>小学2年级1班数学老师</p>
                                                        <p class='detail_main songti'>毕业于北京大学毕业于北京大学毕业于北京大学毕业于北京大学</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div> 
                                        <div class='swiper-slide swiper-no-swiping'>
                                            <div class='exhibition_box'>
                                                <div class='exhibition_pic_box'>
                                                    <img src="resource/teacher1.jpg">
                                                    <div class='exhibition_info_title'></div>
                                                     <div class='exhibition_info_title_box yahei'>
                                                        <p>王小丽</p>
                                                        <p>2年1班数学老师</p>
                                                    </div>
                                                    <div class='exhibition_info_detail'>
                                                        <p class='detail_name yahei'>王小丽</p>
                                                        <p class='detail_class yahei'>小学2年级1班数学老师</p>
                                                        <p class='detail_main songti'>毕业于北京大学毕业于北京大学毕业于北京大学毕业于北京大学</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class='swiper-slide swiper-no-swiping'>
                                            <div class='exhibition_box'>
                                                <div class='exhibition_pic_box'>
                                                    <img src="resource/teacher1.jpg">
                                                    <div class='exhibition_info_title'></div>
                                                     <div class='exhibition_info_title_box yahei'>
                                                        <p>王小丽</p>
                                                        <p>2年1班数学老师</p>
                                                    </div>
                                                    <div class='exhibition_info_detail'>
                                                        <p class='detail_name yahei'>王小丽</p>
                                                        <p class='detail_class yahei'>小学2年级1班数学老师</p>
                                                        <p class='detail_main songti'>毕业于北京大学毕业于北京大学毕业于北京大学毕业于北京大学</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class='swiper-slide swiper-no-swiping'>
                                            <div class='exhibition_box'>
                                                <div class='exhibition_pic_box'>
                                                    <img src="resource/teacher1.jpg">
                                                    <div class='exhibition_info_title'></div>
                                                     <div class='exhibition_info_title_box yahei'>
                                                        <p>王小丽</p>
                                                        <p>2年1班数学老师</p>
                                                    </div>
                                                    <div class='exhibition_info_detail'>
                                                        <p class='detail_name yahei'>王小丽</p>
                                                        <p class='detail_class yahei'>小学2年级1班数学老师</p>
                                                        <p class='detail_main songti'>毕业于北京大学毕业于北京大学毕业于北京大学毕业于北京大学</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>                         
                                    </div>    
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class='education'>
                    <div class='centerbox'>
                        <div class='box_title'>           
                            <div class='title' style='width:302px;'>
                                <span class='title_cn'>教育教学</span>
                                <span class='title_en'>Education Teaching</span>
                            </div>
                        </div>
                        <div class='education_info'>
                            <div class='education_info_box load'>
                                <div class='education_pic_box'>
                                    <img src="resource/education1.jpg">
                                </div>
                                <div class='education_msg'>
                                    <div class='education_title yahei'>
                                        <span class='education_title_cn'>精彩课堂</span>
                                        <span class='education_title_en'>Excellent Course</span>
                                    </div>
                                    <ul class='education_list'>
                                        <li>给父母最好的选择,给孩子最好...</li>
                                        <li>启迪人生,健康成长</li>
                                        <li>自尊,自信,友善,善良</li>
                                        <li>关注基本素养,培育有自信,守规则</li>
                                    </ul>
                                </div>                            
                            </div>
                            <div class='education_info_box load'>
                                <div class='education_pic_box'>
                                    <img src="resource/education2.jpg">
                                </div>
                                <div class='education_msg'>
                                    <div class='education_title yahei'>
                                        <span class='education_title_cn'>精彩课堂</span>
                                        <span class='education_title_en'>Excellent Course</span>
                                    </div>
                                    <ul class='education_list'>
                                        <li>给父母最好的选择,给孩子最好...</li>
                                        <li>启迪人生,健康成长</li>
                                        <li>自尊,自信,友善,善良</li>
                                        <li>关注基本素养,培育有自信,守规则</li>
                                    </ul>
                                </div>                            
                            </div>
                            <div class='education_info_box load'>
                                <div class='education_pic_box'>
                                    <img src="resource/education3.jpg">
                                </div>
                                <div class='education_msg'>
                                    <div class='education_title yahei'>
                                        <span class='education_title_cn'>精彩课堂</span>
                                        <span class='education_title_en'>Excellent Course</span>
                                    </div>
                                    <ul class='education_list'>
                                        <li>给父母最好的选择,给孩子最好...</li>
                                        <li>启迪人生,健康成长</li>
                                        <li>自尊,自信,友善,善良</li>
                                        <li>关注基本素养,培育有自信,守规则</li>
                                    </ul>
                                </div>                            
                            </div>
                        </div>
                    </div>
                </div>
                <div class='school_introduce'>
                    <div class='centerbox'>
                        <div class='school load'>
                            <img src="resource/school.jpg">
                            <div class='school_detail'>
                                <div class='people_title'>
                                    <span class='people_title_cn'>学校简介</span>
                                    <span class='people_title_en'>School Profile</span>
                                </div>
                                <p class='yahei'>
                                    XXXX学校是XXXX负责创办的,致力于提高学生成绩
                                </p>
                                <p class='yahei'>
                                    XXXX school was founded by XXXX and is committed to improving students' performance
                                </p>
                                <p class='yahei'>
                                    学校采用清华附中国际课程,以中西合璧的教育理念,博采中国教育和国际教育之所长,保护中国文化中的精髓部分,提供扎根中国、清华特色的国际教育。
                                </p>
                                <div class='detail_icon'><img src="resource/detailicon.png" /></div>
                            </div>
                        </div>
                        <div class='people load'>
                            <div class='people_title yahei'>
                                <span class='people_title_cn'>领导团队</span>
                                <span class='people_title_en'>Leadership</span>
                            </div>
                            <div class='people_info'>
                                <div class="people_info_left"><img src="resource/left2.png"></div> 
                                <div class="people_info_right"><img src="resource/right2.png"></div> 
                                <div class='swiper-container swiper-container4'>
                                    <div class='swiper-wrapper'>
                                        <div class='swiper-slide swiper-no-swiping'>
                                            <div class='people_box'>
                                                <div class='people_img_box'>
                                                    <img src="resource/people1.jpg">
                                                </div>
                                                <div class='people_msg yahei'>
                                                    <p class='people_msg_t'>学校领导</p>
                                                    <p class='people_msg_m'>学校领导主要负责什么事物,毕业哪所学校,所学什么专业学校领导主要负责什么事物,毕业哪所学校,所学什么专业学校领导主要负责什么事物,毕业哪所学校,所学</p><span class='yahei'>[查看详情]</span>
                                                </div>
                                            </div> 
                                        </div>
                                    </div>
                                </div>                                  
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class='foot'>
                <div class='centerbox'>
                    <div class='foot_link'>
                        <p>XXX大学技术办公室主办   XXXXX未经许可,请勿转载</p>

                        <p> 地址:安徽省合肥市XXX,XXXXXXXXXXX号楼</p>

                        <p> opyright© 2022-2040   http://www.baidu.com</p>
                    </div>
                    <div class='qcode_box'>
                        <div class='detail_info'>
                            <p><span>地址:</span><span>XXXX学校</span></p>
                            <p><span>邮编:</span><span>100000</span></p>
                            <p><span>网址:</span><span><a href="#">www.baidu.com</a></span></p>
                            <p><span>版权信息:</span><span>版权归所有</span></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script src='js/compatible.js'></script>
        <script src='js/main.js'></script>
        <script type="text/javascript">
            function routerGo(url){
                window.location.href=url;
            }
            $(function(){
                $('.exhibitionLi').each(function(index){
                    $(this).off('click').on('click',function(){
                        $(this).addClass('ischoose');
                        $(this).parent().siblings().children().removeClass('ischoose');
                    })
                })
            })
            
            function hiddenP(obj,line){
                for(var i=0;i<obj.length;i++){
                    $clamp(obj[i], {clamp: line, useNativeClamp: false});    
                }
            }
            /*兼容实现多浏览器文本隐藏*/
            var header = document.getElementsByTagName('body')[0].getElementsByClassName('people_msg_m')  
            var news = document.getElementsByTagName('body')[0].getElementsByClassName('news_info_txt') 
            hiddenP(header,9);
            hiddenP(news,3)   
            $('.people_msg_m').css('display','inline')

            if(navigator.appVersion.indexOf("MSIE 7.0")>0||navigator.appVersion.indexOf("MSIE 6.0")>0){
                alert('浏览器版本过低!')
            }else{
                
            }
        </script>
    </body>
</html>

 

 

  • 1
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

qq_28917403

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值