基于Bootstrap的H5响应式网站开发技术研究

发布时间：2022-10-03 16:24

　　在如今移动设备用户的数量多于PC端的时代,传统的企业网站在移动端展示时往往会出现各种问题,这会影响用户的体验和对企业的印象。在这种情况下更多企业愿意把其官网开发成响应式网站以让官网在不同尺寸的设备上都有良好的展现,从而满足了企业对官网的跨平台、多设备需求,响应式网站因此变得广泛流行。现在国内外有很多优秀的响应式前端框架,本研究运用了开发人员容易上手的Bootstrap框架,因为用它能高效率、低成本地开发有特色的响应式网站。本文的主要工作有:运用Bootstrap框架、HTML5等相关技术开发响应式网站,运用预处理语言Sass（Syntactically Awesome Stylesheets）及其扩展库Compass对网站的CSS部分进行高效开发,总结开发过程中在性能方面可以优化的点以及常见问题的解决方法。本文所研究的用预处理语言开发网站的CSS部分可以极大提高网站开发和维护的效率,所总结开发中遇到的问题和优化的方法可作为开发者的参考。 

【文章页数】：59 页

【学位级别】：硕士

【文章目录】：
摘要
Abstract
1 引言
    1.1 课题研究背景与意义
    1.2 国内外研究现状
        1.2.1 国内现状
        1.2.2 国外现状
    1.3 本文的主要工作
    1.4 本文结构安排
2 相关技术及工具
    2.1HTML5
    2.2CSS3
    2.3 Bootstrap框架
    2.4 CSS预处理语言Sass
    2.5 Sass的扩展库Compass
    2.6 JavaScript
    2.7 jQuery
    2.8 工具介绍
3 响应式网站的优化设计与实现
    3.1 需求分析
    3.2 整体解决方案
        3.2.1 响应式网站实现方案
        3.2.2 弹性图片实现方案
    3.3 网站UI和交互的设计原则
    3.4 前端页面的具体实现
        3.4.1 网站整体结构
        3.4.2 响应式网站核心代码
        3.4.3 首页
        3.4.4 经典案例
        3.4.5 主要产品
        3.4.6 企业新闻
        3.4.7 关于我们
        3.4.8 联系我们
        3.4.9 登录注册
4 网站的优化和问题解决
    4.1 用预处理语言优化开发
    4.2 设计和交互上的优化
    4.3 性能优化
    4.4 问题及解决办法
5 网站测试
    5.1 功能测试
    5.2 性能测试
    5.3 兼容性测试
6 总结与展望
    6.1 总结
    6.2 展望
参考文献
个人简历、在学期间发表的学术论文与研究成果
致谢


【参考文献】：
期刊论文
[1]基于Bootstrap框架的响应式网页设计与实现[J]. 舒后,熊一帆,葛雪娇.  北京印刷学院学报. 2016(02)
[2]基于BootStrap的WEB开发设计研究[J]. 李金亮,李春青.  中小企业管理与科技(中旬刊). 2014(05)



本文编号：3684405