web前端大作业--响应式风景旅游网页设计（国庆旅游主题-HTML+CSS+JavaScript）实现

🍅 作者主页：Java李杨勇 

🍅 简介：Java领域优质创作者🏆、【java李杨勇】公号作者✌  简历模板、学习资料、面试题库、技术互助【关注我，都给你】

🍅 欢迎点赞 👍 收藏 ⭐留言 📝   

 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在专栏👇🏻👇🏻👇🏻👇🏻

java项目精品实战分享案例《100套》

web前端期末大作业网页实战《100套》

 Html+Css+JavaScript期末大作业《100套》 

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

网页实现截图：文末获取源码

视频演示连接：   HTML5+CSS+JS--期末大作业 创建响应式旅游网页网站设计【附完整源码】

网站首页 

关于我们

途牛旅游网创立于2006年10月，以“让旅游更简单”为使命，为消费者提供由北京、xx、广州、深圳等180个城市出发的旅游产品预订服务，产品全面，价格透明，全年365天24小时400电话预订，并提供丰富的后续服务和保障。目前，途牛旅游网提供100万余种旅游产品供消费者选择，涵盖跟团、自助、自驾、邮轮、酒店、签证、景区门票以及公司旅游等，已成功服务累计超过1500万人次出游。同时基于途牛旅游网全球中文景点目录以及中文旅游社区，可以更好地帮助游客了解目的地信息，妥善制定好出游计划，并方便地预订旅程中的服务项目。

主题旅游

  
香港2日半自助游
 
特色：港式早茶 线路编号:HK01

 销量：1348484 满意度：100% 推荐：五星
 
行程：2日半自助游 出团日期：2017-2-6
原价：499348起/人

热门目的地

新闻资讯

舒适酒店

联系我们

项目组织结构：

主要源码展示：

index.html

  

    


    
        

        
            
            
                
            
            
                
                    网站首页
                     关于我们
                        

                        
                    
                    
                        
                            
                        
                        主题旅游
                        

                            国内游

                            出境游

                        
                    
                    
                        
                            
                        
                        热门目的地
                        

                            云南

                            四川

                            福建

                        
                    
                     新闻资讯
                        

                        
                    
                    
                        
                            
                        
                        舒适酒店
                        

                            双人间

                            单人间

                            总统套房

                        
                    
                     联系我们
                        

                        
                    
                
            
        
        
        
            
                
                
                    
                        
                    
                    
                        首页
                        关于我们
                            
                            
                        
                        主题旅游
                            
                                国内游 出境游 
                        
                        热门目的地
                            
                                云南 四川 福建 
                        
                        新闻资讯
                            
                            
                        
                        舒适酒店
                            
                                双人间 单人间 总统套房 
                        
                        联系我们
                            
                            
                        
                    
                
            
    

style.css

@media (min-width: 1700px) {
    /*#wrap_index .container,#footer .container{width: 100% !important;} 
    #wrap_index .ny_main .container{width: 80% !important;} 
    #wrap_index .ny_prolist .container{width: 94% !important;} */
}

#wrap_index {
    overflow: hidden;
    position: relative;
}

/*头部*/

@media (min-width: 991px) {
    #header {
        display: block;
    }
    #molheader {
        display: none;
    }
}

@media (max-width: 990px) {
    #molheader1 {
        display: block;
    }
    #header {
        display: none;
    }
}

/*panle导航开始*/

.class {
    width: 280px;
    height: 100%;
    z-index: 7;
    background: #090b0f;
    position: fixed;
    top: 0px;
    right: 0px;
    color: #7e8696;
    z-index: 44;
}

.class .close {
    position: absolute;
    opacity: 1;
    left: -30px;
    top: 18px;
    background: url(../image/close.png) no-repeat;
    background-size: 100% 100%;
    width: 24px;
    height: 24px;
}

.class.page-prev .close {
    left: 0;
}

.class-top {
    height: 70px;
    overflow: hidden;
    background: #12161e;
    margin: 0;
    font-size: 24px;
    text-align: center;
    line-height: 70px;
}

.class-top form {
    width: 230px;
    margin: 16px auto;
    height: 40px;
    position: relative;
}

作品来自于网络收集、侵权立删 

获取完整源码：

大家点赞、收藏、关注、评论啦 、查看下方👇🏻👇🏻👇🏻微信公众号获取👇🏻👇🏻👇🏻

打卡 文章 更新 70/  100天

 专栏推荐阅读：

Java毕设项目精品实战案例《100套》

HTML5大作业实战案例《100套》

Web大作业前端网页实战《100套》