在数字化迅速发展的今天，Web前端开发作为互联网行业的核心之一，吸引了越来越多的学习者。无论是想要进入IT行业的新人，还是希望提升技能的在职人员，前端开发都是一个不可忽视的领域。本文将介绍Web前端开发所需学习的课程，帮助读者了解这一领域的基础知识和技能要求。

_x000D_

HTML基础知识

_x000D_ HTML（超文本标记语言）是构建网页的基础。学习HTML的第一步是理解其结构，包括文档类型、标签和元素。HTML文档由一系列标签构成，这些标签定义了网页的内容和结构。掌握HTML的基本标签如

、、

至
、
等，是构建网页的第一步。_x000D_
在学习HTML时，理解语义化标签的重要性也不可忽视。语义化标签不仅有助于搜索引擎优化（SEO），还能提高网页的可读性和可维护性。例如，使用
和
标签可以清晰地组织内容，使其更易于理解。
_x000D_
学习HTML时还需要掌握如何使用表单标签来收集用户输入。表单是与用户交互的重要方式，通过、</span>等标签，可以创建各种类型的输入框。这些都是前端开发的基本知识，只有掌握了这些，才能进一步学习CSS和JavaScript。</p>_x000D_ <p style="text-indent: 2em;">了解HTML5的新特性也是学习的重点。HTML5引入了许多新的标签和API，如<span style="color:#C7254E;background: #F9F2F4;"><canvas></span>和<span style="color:#C7254E;background: #F9F2F4;"><video></span>，使得开发者能够创建更丰富的用户体验。通过学习HTML5，开发者可以在网页中嵌入视频和图形，提升用户的互动感。</p>_x000D_ <p style="text-indent: 2em;"><strong>CSS样式设计</strong></p>_x000D_ <p style="text-indent: 2em;">CSS（层叠样式表）是控制网页外观的关键。学习CSS的第一步是理解选择器、属性和样式规则。选择器用于选择HTML元素，并为其应用样式。掌握基本的选择器如元素选择器、类选择器和ID选择器，是设计网页的基础。</p>_x000D_ <p style="text-indent: 2em;">在CSS中，盒模型是一个重要的概念。每个HTML元素都可以被看作一个盒子，盒模型定义了元素的宽度、高度、边距、填充和边框。理解盒模型可以帮助开发者更好地控制元素的布局和间距，从而实现更美观的网页设计。</p>_x000D_ <p style="text-indent: 2em;">布局技巧也是CSS学习的重要部分。CSS提供了多种布局方式，如浮动布局、定位布局和Flexbox布局。Flexbox布局特别适合于响应式设计，可以使网页在不同设备上都能良好显示。掌握这些布局技巧，可以提高网页的用户体验。</p>_x000D_ <p style="text-indent: 2em;">CSS动画和过渡效果的使用也为网页增添了生动的元素。通过CSS的<span style="color:#C7254E;background: #F9F2F4;">transition</span>和<span style="color:#C7254E;background: #F9F2F4;">animation</span>属性，开发者可以创建流畅的动画效果，使用户与网页的交互更加生动有趣。</p>_x000D_ <p style="text-indent: 2em;"><strong>JavaScript编程基础</strong></p>_x000D_ <p style="text-indent: 2em;">JavaScript是前端开发中不可或缺的编程语言。学习JavaScript的第一步是理解基本语法，包括变量、数据类型和运算符。掌握这些基础知识后，开发者可以开始编写简单的脚本，来实现网页的动态效果。</p>_x000D_ <p style="text-indent: 2em;">在JavaScript中，函数是一个重要的概念。函数不仅可以封装代码，还可以提高代码的重用性。学习如何定义和调用函数，理解参数和返回值的概念，是深入学习JavaScript的关键。</p>_x000D_ <p style="text-indent: 2em;">DOM（文档对象模型）操作是前端开发的重要技能。通过JavaScript，开发者可以动态地修改网页内容、样式和结构。掌握DOM操作，可以实现用户交互效果，如点击按钮后显示隐藏内容等。</p>_x000D_ <p style="text-indent: 2em;">事件处理也是JavaScript学习的重点。通过事件监听，开发者可以响应用户的操作，如鼠标点击、键盘输入等。理解事件的传播机制和事件委托，可以帮助开发者创建更复杂的用户交互效果。</p>_x000D_ <p style="text-indent: 2em;">学习JavaScript的异步编程也是至关重要的。通过Promise和async/await，开发者可以处理异步操作，如网络请求和定时器。这些知识将为开发者在实际项目中处理复杂的逻辑打下坚实的基础。</p>_x000D_ <p style="text-indent: 2em;"><strong>前端框架与库</strong></p>_x000D_ <p style="text-indent: 2em;">随着Web开发的不断发展，前端框架和库的使用日益普及。学习流行的前端框架如React、Vue和Angular，可以帮助开发者提高开发效率。每个框架都有其独特的特性和优势，了解这些框架的基本概念和用法，是现代前端开发的必备技能。</p>_x000D_ <p style="text-indent: 2em;">React是一个以组件为基础的库，适合构建用户界面。学习React时，理解组件的生命周期、状态管理和props的使用是关键。这些知识将帮助开发者创建可重用的UI组件，提高开发效率。</p>_x000D_ <p style="text-indent: 2em;">Vue则以其简单易用而受到欢迎。学习Vue时，掌握指令、计算属性和生命周期钩子等概念，可以帮助开发者快速上手。Vue的双向数据绑定特性，使得数据和视图的同步变得更加简单。</p>_x000D_ <p style="text-indent: 2em;">Angular是一个功能强大的前端框架，适合大型应用的开发。学习Angular时，理解模块化、依赖注入和路由管理是重要的。Angular的强类型特性也使得代码的可维护性和可读性大大提高。</p>_x000D_ <p style="text-indent: 2em;">了解前端构建工具如Webpack和Gulp，可以帮助开发者优化项目的构建流程。这些工具可以自动化处理文件的打包、压缩和热更新，使得开发过程更加高效。</p>_x000D_ <p style="text-indent: 2em;"><strong>响应式设计</strong></p>_x000D_ <p style="text-indent: 2em;">响应式设计是现代Web开发的重要理念。学习响应式设计的第一步是理解媒体查询的使用。通过CSS的媒体查询，开发者可以根据不同的设备特性，应用不同的样式，从而实现适应各种屏幕尺寸的网页设计。</p>_x000D_ <p style="text-indent: 2em;">在响应式设计中，流式布局也是一个重要的概念。通过使用百分比宽度和弹性盒子布局，开发者可以创建灵活的网页布局，使其在不同设备上都能良好显示。掌握这些布局技巧，可以提升用户的浏览体验。</p>_x000D_ <p style="text-indent: 2em;">学习如何使用CSS框架如Bootstrap和Tailwind CSS，可以加速响应式设计的实现。这些框架提供了预定义的样式和组件，使得开发者可以快速构建美观的响应式网页。</p>_x000D_ <p style="text-indent: 2em;">了解移动优先设计的理念也是响应式设计的重要部分。移动优先设计强调在设计时首先考虑移动设备的用户体验，再逐步扩展到桌面设备。这种设计思路可以帮助开发者更好地满足用户需求。</p>_x000D_ <p style="text-indent: 2em;"><strong>前端开发工具</strong></p>_x000D_ <p style="text-indent: 2em;">在Web前端开发中，掌握各种开发工具是非常重要的。学习使用代码编辑器如VS Code，可以提高代码编写的效率。VS Code提供了丰富的插件和功能，如代码高亮、自动补全和调试工具，帮助开发者更好地管理项目。</p>_x000D_ <p style="text-indent: 2em;">版本控制系统如Git也是前端开发的必备工具。学习Git的基本命令和工作流程，可以帮助开发者更好地管理代码版本，协作开发。通过Git，开发者可以轻松地追踪代码的变化，避免因错误操作导致的代码丢失。</p>_x000D_ <p style="text-indent: 2em;">调试工具也是前端开发的重要组成部分。浏览器的开发者工具可以帮助开发者实时查看和调试网页的HTML、CSS和JavaScript。掌握调试工具的使用，可以快速定位和解决问题，提高开发效率。</p>_x000D_ <p style="text-indent: 2em;">了解前端构建工具如Webpack、Parcel和Gulp，可以帮助开发者自动化构建流程。这些工具可以处理文件的打包、压缩和热更新，使得开发过程更加高效。</p>_x000D_ <p style="text-indent: 2em;">学习如何使用API测试工具如Postman，可以帮助开发者更好地调试和测试后端接口。通过Postman，开发者可以模拟请求和响应，确保前后端的顺利对接。</p>_x000D_ <p style="text-indent: 2em;"><strong>项目实战经验</strong></p>_x000D_ <p style="text-indent: 2em;">在学习Web前端开发的过程中，项目实战经验是不可或缺的。通过参与实际项目，开发者可以将所学知识应用于实践，提升自己的技能。选择一个合适的项目，可以帮助开发者更好地理解前端开发的流程和技巧。</p>_x000D_ <p style="text-indent: 2em;">在项目中，开发者需要学习如何进行需求分析和设计。了解用户需求，制定合理的开发计划，是项目成功的关键。通过与团队成员的沟通和协作，可以提高项目的开发效率和质量。</p>_x000D_ <p style="text-indent: 2em;">项目中还需要进行代码的编写和测试。通过编写高质量的代码，遵循编码规范，可以提高代码的可维护性和可读性。在测试阶段，开发者需要对代码进行全面的测试，确保项目的稳定性和可靠性。</p>_x000D_ <p style="text-indent: 2em;">项目上线后，开发者还需要关注用户反馈和数据分析。通过分析用户行为和反馈，可以不断优化和改进项目，提高用户体验。这一过程也是前端开发的重要环节。</p>_x000D_ <p style="text-indent: 2em;">参与开源项目也是积累实战经验的好方法。通过贡献代码和参与社区讨论，开发者可以学习到更多的开发技巧和经验，提升自己的技术水平。</p>_x000D_ <p style="text-indent: 2em;">Web前端开发的学习之路是充满挑战和机遇的。掌握HTML、CSS、JavaScript及相关框架和工具，不仅能帮助开发者在这一领域立足，也能为未来的职业发展打下坚实的基础。希望本文能为你提供一些有价值的参考，助你在前端开发的道路上越走越远。</p>_x000D_ </div> <div class="tag-wrap" style="margin: 30px auto 0;width: 810px;display: -ms-flexbox;display: flex;-ms-flex-align: center;align-items: center;"> <span class="tag-label" style="font-size: 16px; line-height: 22px;margin-right: 6px;">tags:</span> <a id="tag_click" target="_blank" style="display: inline-block" href="http://www.mobiletrain.org/tag-0-1.html">IT培训</a> </div> <div class="con-left-bottom"> 声明：本站稿件版权均属千锋教育所有，未经许可不得擅自转载。 </div> <div class="left-form"> <div class="left-form-left"> <div class="h3">10年以上业内强师集结，手把手带你蜕变精英</div> <div class="list-form-item"> <i class="ypfont yp-name"></i> <input type="text" placeholder="您的姓名" name="realname" id="realname" autocomplete="off" /> </div> <div class="list-form-item list-form-item2"> <i class="ypfont yp-shouji"></i> <input type="text" placeholder="您的电话" name="realphone" id="phone" autocomplete="off" /> </div> <div class="h4">请您保持通讯畅通，专属学习老师24小时内将与您1V1沟通</div> <div class="list-submit"> 免费领取<br /><i class="ypfont yp-dianjitianjia"></i> </div> </div> <div class="left-form-right"> <div class="h3">今日已有<span>369</span>人领取成功</div> <div class="swiper-container swiper-phone swiper-no-swiping"> <div class="swiper-wrapper"> <div class="swiper-slide"> 刘同学 1382860 刚刚成功领取 </div> <div class="swiper-slide"> 王同学 1312015 刚刚成功领取 </div> <div class="swiper-slide"> 张同学 1334652 刚刚成功领取 </div> <div class="swiper-slide"> 李同学 1358607 刚刚成功领取 </div> <div class="swiper-slide"> 杨同学 1325667 刚刚成功领取 </div> <div class="swiper-slide"> 岳同学 1346652 刚刚成功领取 </div> <div class="swiper-slide"> 梁同学 1572950 刚刚成功领取 </div> <div class="swiper-slide"> 刘同学 1891015 刚刚成功领取 </div> <div class="swiper-slide"> 张同学 1554678 刚刚成功领取 </div> <div class="swiper-slide"> 邹同学 1392907 刚刚成功领取 </div> <div class="swiper-slide"> 董同学 1382867 刚刚成功领取 </div> <div class="swiper-slide"> 周同学 1363602 刚刚成功领取 </div> </div> </div> </div> </div> </div> <div class="c_page_bottom"> <div class="c_page_bottom_item"> <div class="c_page_bottom_item_up"></div> <p>上一篇</p> <a href="http://www.mobiletrain.org/about/info/306346.html" title="306347" target="_blank">web前端开发要多少钱</a> </div> <div class="c_page_bottom_item"> <div class="c_page_bottom_item_next"></div> <p>下一篇</p> <a href="http://www.mobiletrain.org/about/info/306348.html" target="_blank" title="306347">web前端开发都学什么</a> </div> </div> <div class="left-ad"> <a href="javascript:;" onclick="open53_pc()" rel="nofollow" class="left-ad-btn"> 免费打包获取<i class="ypfont yp-dianjitianjia"></i> </a> </div>  <div class="article article-hot" style="margin-top: 20px"> <div class="article-tit-box"> <div class="art-tit h3"> 相关推荐<span class="art-hot">HOT</span> </div>  </div> <div class="art-con"> <a href="http://www.mobiletrain.org/about/info/306392.html" target="_blank" class="art-item"> <div class="art-item-img"> <img src="/tywzt/ty70.jpg" alt="" /> </div> <div class="art-item-info"> <div class="h4">云计算培训学费是多少钱</div> <p> 随着云计算技术的迅速发展，越来越多的人希望通过专业培训来提升自己的技能。云计算培训的学费因多种因素而异，成为许多学员关注的焦点。本文将...<span>详情>></span> </p> <span>2024-10-18 09:43:40</span> </div> </a> <a href="http://www.mobiletrain.org/about/info/306391.html" target="_blank" class="art-item"> <div class="art-item-img"> <img src="/tywzt/ty63.jpg" alt="" /> </div> <div class="art-item-info"> <div class="h4">云计算培训学校费用高吗</div> <p> 随着云计算技术的迅猛发展，越来越多的人开始关注云计算培训学校的费用问题。本文将从多个角度分析云计算培训学校的费用是否高昂，探讨影响费用...<span>详情>></span> </p> <span>2024-10-18 09:38:00</span> </div> </a> <a href="http://www.mobiletrain.org/about/info/306386.html" target="_blank" class="art-item"> <div class="art-item-img"> <img src="/tywzt/ty35.jpg" alt="" /> </div> <div class="art-item-info"> <div class="h4">云计算培训多少费用多少</div> <p> 在当今数字化时代，云计算正逐渐成为企业和个人发展的重要工具。随着企业对云技术需求的增加，云计算培训也愈发受到关注。很多人开始询问：云计...<span>详情>></span> </p> <span>2024-10-18 09:09:40</span> </div> </a> <a href="http://www.mobiletrain.org/about/info/306378.html" target="_blank" class="art-item"> <div class="art-item-img"> <img src="/tywzt/ty54.jpg" alt="" /> </div> <div class="art-item-info"> <div class="h4">云计算培训费用要多少</div> <p> 在数字化时代，云计算已经成为企业和个人提升效率、降低成本的重要工具。随着云计算技术的不断发展，相关的培训需求也随之增加。许多人在考虑参...<span>详情>></span> </p> <span>2024-10-18 08:18:40</span> </div> </a> <a href="http://www.mobiletrain.org/about/info/306372.html" target="_blank" class="art-item"> <div class="art-item-img"> <img src="/tywzt/tongyong10.jpg" alt="" /> </div> <div class="art-item-info"> <div class="h4">上海嵌入式工程师就业前景</div> <p> 近年来，嵌入式技术在各个行业中得到了广泛应用，尤其是在智能家居、工业自动化、汽车电子等领域。随着物联网（IoT）的快速发展，嵌入式系统的...<span>详情>></span> </p> <span>2024-10-18 07:44:40</span> </div> </a> </div> </div> </div> </div> <div class="con-right"> <div class="con-right-rywd"> <div class="rywd-tit h3"> <i class="ypfont yp-weinituijian"></i>热门推荐 </div> <div class="swiper3"> <a href="http://www.mobiletrain.org/about/info/306396.html" target="_blank"> <div class="ypfont yp-zhiding"></div> <p>云计算培训班学费多少钱专</p> <span class="a11">沸</span> </a> <a href="http://www.mobiletrain.org/about/info/306395.html" target="_blank"> <div class="ypfont yp-1"></div> <p>云计算培训班学费多少钱</p> <span class="a21">热</span> </a> <a href="http://www.mobiletrain.org/about/info/306394.html" target="_blank"> <div class="ypfont yp-2"></div> <p>云计算培训班一般多少钱</p> <span class="a31">热</span> </a> <a href="http://www.mobiletrain.org/about/info/306393.html" target="_blank"> <div class="ypfont yp-3"></div> <p>云计算培训机构要多少钱</p> <span class="a41">新</span> </a> <a href="http://www.mobiletrain.org/about/info/306392.html" target="_blank"> <div class="a5"> 4 </div> <p>云计算培训学费是多少钱</p> </a> <a href="http://www.mobiletrain.org/about/info/306391.html" target="_blank"> <div class="a6"> 5 </div> <p>云计算培训学校费用高吗</p> </a> <a href="http://www.mobiletrain.org/about/info/306390.html" target="_blank"> <div class="a7"> 6 </div> <p>云计算培训学校费用申请</p> </a> <a href="http://www.mobiletrain.org/about/info/306389.html" target="_blank"> <div class="a8"> 7 </div> <p>云计算培训学校费用多少</p> </a> <a href="http://www.mobiletrain.org/about/info/306388.html" target="_blank"> <div class="a9"> 8 </div> <p>云计算培训学校费用公示</p> </a> <a href="http://www.mobiletrain.org/about/info/306387.html" target="_blank"> <div class="a10"> 9 </div> <p>云计算培训多少费用标准</p> </a> </div>  </div>  <a href="javascript:;" rel="nofollow" onclick="open53_pc()" class="right-ad"> <img src="/images/right-ad.jpg" alt="" /></a>  <div class="con-right-rywd"> <div class="tk-tit h3"> <a class="left" href="http://www.mobiletrain.org/about/BBS/" target="_blank"><i class="ypfont yp-fabujishu" ></i>技术干货</a> <a href="http://www.mobiletrain.org/about/BBS/" target="_blank">更多>></a> </div> <div class="swiper2 "> <a href="http://www.mobiletrain.org/about/BBS/258998.html" class="swiper-slide" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/ty33.jpg" alt="" /> </div> <div> <div class="h3">如何实现服务器负载均衡</div> <p>2023-12-06</p> </div> </a> <a href="http://www.mobiletrain.org/about/BBS/258997.html" class="swiper-slide" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/tongyong12.jpg" alt="" /> </div> <div> <div class="h3">linux有哪些优势和劣势</div> <p>2023-12-06</p> </div> </a> <a href="http://www.mobiletrain.org/about/BBS/258996.html" class="swiper-slide" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/ty64.jpg" alt="" /> </div> <div> <div class="h3">linux需要驱动吗</div> <p>2023-12-06</p> </div> </a> <a href="http://www.mobiletrain.org/about/BBS/258995.html" class="swiper-slide" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/tongyong7.jpg" alt="" /> </div> <div> <div class="h3">android与linux的区别</div> <p>2023-12-06</p> </div> </a> <a href="http://www.mobiletrain.org/about/BBS/258994.html" class="swiper-slide" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/ty64.jpg" alt="" /> </div> <div> <div class="h3">如何搭建基于容器的深度学习环境</div> <p>2023-12-06</p> </div> </a> </div> </div>  <div class="con-right-rywd"> <div class="tk-tit h3"> <a class="left" href="http://www.mobiletrain.org/zcjy/" target="_blank"><i class="ypfont yp-minzhengtubiao1-46" ></i>职场就业</a> <a href="http://www.mobiletrain.org/zcjy/" target="_blank">更多>></a> </div> <div class="swiper2 "> <a href="http://www.mobiletrain.org/zcjy/wlaq/259025.html" class="swiper-slide zcjy" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/ty41.jpg" alt="" /> </div> <div> <div class="h3">网络安全软件开发的就业前景</div> <p>2023-12-09</p> </div> </a> <a href="http://www.mobiletrain.org/zcjy/python/259024.html" class="swiper-slide zcjy" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/tongyong6.jpg" alt="" /> </div> <div> <div class="h3">学会python工程师后的就业前景</div> <p>2023-12-09</p> </div> </a> <a href="http://www.mobiletrain.org/zcjy/java/259023.html" class="swiper-slide zcjy" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//tywzt/tongyong2.jpg" alt="" /> </div> <div> <div class="h3">学会java工程师后的就业前景</div> <p>2023-12-09</p> </div> </a> <a href="http://www.mobiletrain.org/zcjy/linux/136992.html" class="swiper-slide zcjy" target="_blank"> <div class="img-box"> <img src="http://www.mobiletrain.org//2023/0428/1682660765277.png" alt="" /> </div> <div> <div class="h3">云计算技术就业前景以及发展方向怎样？</div> <p>2023-08-07</p> </div> </a> </div> </div>  <div class="con-right-rywd"> <div class="rywd-tit h3"> <i class="ypfont yp-weinituijian"></i>快速通道 </div> <ul class="kstd"> <li> <div class="h3">培训机构</div> <a href="http://www.mobiletrain.org/training/" target="_blank">了解培训相关</a> </li> <li> <div class="h3">就业前景</div> <a href="http://www.mobiletrain.org/zcjy/" target="_blank">查看就业前景</a> </li> <li> <div class="h3">培训门槛</div> <a href="http://www.mobiletrain.org/ljc/" target="_blank">了解学习门槛</a> </li> <li> <div class="h3">应聘面试</div> <a href="http://www.mobiletrain.org/interview/" target="_blank">常见面试考题</a> </li> <li> <div class="h3">就业服务</div> <a href="http://www.mobiletrain.org/employ/" target="_blank" rel="nofollow">毕业推荐就业</a> </li> <li> <div class="h3">师资团队</div> <a href="http://www.mobiletrain.org/teachers/" target="_blank" rel="nofollow">了解师资团队</a> </li> </ul> </div> </div> </div> </div> </div> </div> <link rel="stylesheet" href="/css/css3451.css"> <div class="edu-footer"> <div class="base"> <div class="con-left"> <img src="http://www.mobiletrain.org/images_index/new-logo-white.png" class="edu-footer-logo" /> <p class="edu-footer-sologan">初心至善匠心育人</p> <p class="edu-footer-phoneNumber"> <i class="icon icon-dianhua1"></i>400-811-9990 <a href="javascript:;" onclick="open53_pc()" rel="nofollow">24小时在线咨询</a> </p> </div> <div class="con-right"> <div class="edu-footer-about-links"> <div class="list1 list"> <div class="h4">关于千锋</div> <ul> <li> <a href="http://www.mobiletrain.org/about/" target="_blank" rel="nofollow">千锋简介</a> </li> <li> <a href="http://www.mobiletrain.org/about/contact.html" target="_blank" rel="nofollow">联系我们</a> </li> <li> <a href="http://www.mobiletrain.org/qynx/" target="_blank" rel="nofollow">企业服务</a> </li> <li> <a href="http://www.mobiletrain.org/topic/fygy.html" target="_blank" rel="nofollow">锋益公益</a> </li> </ul> </div> <div class="list1 list"> <div class="h4">学习资源</div> <ul> <li> <a href="http://prj.qfedu.com/" target="_blank" rel="nofollow">项目库</a> </li> <li> <a href="http://www.mobiletrain.org/open/" target="_blank" rel="nofollow">公开课</a> </li> <li> <a href="http://video.mobiletrain.org/" target="_blank" rel="nofollow">视频教程</a> </li>  </ul> </div> <div class="list1 list"> <div class="h4">服务指南</div> <ul> <li> <a href="javascript:;" onclick="open53_pc()" rel="nofollow">报名咨询</a> </li> <li> <a href="javascript:;" onclick="open53_pc()" rel="nofollow">校区分布</a> </li> <li> <a href="http://www.mobiletrain.org/sitemap.html" target="_blank" rel="nofollow">网站地图</a> </li> <li> <a href="http://www.mobiletrain.org/privacyPolicy.html" target="_blank" rel="nofollow">隐私声明</a> </li> </ul> </div> </div> <div class="qrcode-box"> <div class="qrcode flex-center"> <img src="/wzt/qr-code-new.png" alt="千锋教育" /> </div> <div class="h4">千锋学习站 | <span>随时随地免费学</span></div> </div> <div class="qrcode-box"> <div class="qrcode flex-center"> <img src="http://www.mobiletrain.org/images_index/qr-code-new2.png" alt="千锋教育" /> </div> <div class="h4">扫一扫进入千锋手机站</div> </div> </div> </div> </div> <div class="footer-link"> <div class="base"> <div class="links-tab"> <span class="active">热门课程</span>    </div> <div class="links-a active">  <a href="http://www.mobiletrain.org/" target="_blank">IT培训</a> <a href="http://java.mobiletrain.org/" target="_blank">java培训</a> <a href="http://www.mobiletrain.org/special/harmonyos.html" target="_blank">鸿蒙开发培训</a> <a href="http://www.mobiletrain.org/special/emb.html" target="_blank">嵌入式培训</a> <a href="http://www.mobiletrain.org/special/python.html" target="_blank">python培训</a> <a href="http://www.mobiletrain.org/special/ui.html" target="_blank">UI培训</a> <a href="http://www.mobiletrain.org/special/test.html" target="_blank">软件测试培训</a> <a href="http://www.mobiletrain.org/special/linux.html" target="_blank">云计算培训</a> <a href="http://www.mobiletrain.org/special/bigdata.html" target="_blank">大数据培训</a> <a href="http://www.mobiletrain.org/special/wlw.html" target="_blank">物联网培训</a> <a href="http://www.mobiletrain.org/special/wlw.html" target="_blank">游戏开发培训</a> <a href="http://www.mobiletrain.org/special/qmt.html" target="_blank">全媒体运营培训</a> <a href="http://www.mobiletrain.org/special/ysjj.html" target="_blank">影视剪辑培训</a> <a href="http://www.mobiletrain.org/special/wlaq.html" target="_blank">网络安全培训</a> </div>        </div> <div class="copyright"> <p class="copyright-p"> Copyright 2011-2025 <a href="javascript:;" rel="nofollow" title="千锋互联">北京千锋互联科技有限公司</a> <a href="https://beian.miit.gov.cn/" rel="nofollow"> 京ICP备12003911号-3 </a> <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802035719" rel="nofollow" style="display: inline-block;text-decoration: none;height: 20px;line-height: 20px;"> <img src="/wzt/beian.png" />京公网安备 11010802030320号 </a> </p> <p>千锋教育运营主体：北京千锋互联科技有限公司，属具备计算机技术培训资质的教育培训机构。</p> </div> </div> <script src="http://www.mobiletrain.org/js/jquery.min.js"></script> <script src="http://www.mobiletrain.org/js/swiper4.5.0.min.js"></script> <script src="http://www.mobiletrain.org/js/common1.js?111"></script> <script src="/js/highlight.min.js"></script> <script> hljs.highlightAll(); var str = $(".content-con .con-left").html() + "" var newstr = str.replace(new RegExp("_x000D_", "gm"), ""); $(".content-con .con-left").html(newstr); if (location.href.indexOf("/about/BBS/") > -1) { $(".nav_right_bg .nav").eq(10).removeClass("topicactive") $(".nav_right_bg .nav").eq(9).addClass("topicactive") } if (location.href.indexOf("/about/info/") > -1) { $(".nav_right_bg .nav").eq(10).removeClass("topicactive") $(".nav_right_bg .nav").eq(8).addClass("topicactive") } $(document).ready(function () { var href = $("#tag_click").attr("href"); if (href && href.indexOf("-0-") != -1) { var tag_code = $("#tag_click").html(); $.ajax({ url: "http://app.mobiletrain.org/tags.php", type: "get", dataType: "json", data: { tag_code: tag_code }, success: function (data) { $("#tag_click").attr( "href", "http://www.mobiletrain.org/tag-" + data + "-1.html" ); }, }); } }); new Swiper(".swiper1", { loop: true, autoplay: true, pagination: { el: ".swiper-pagination1", }, }); new Swiper(".swiper-news", { autoplay: true, loop: true, direction: "vertical", }); $(".footer-link .links-tab span").click(function () { $(this).addClass("active").siblings().removeClass("active"); $(".footer-link .links-a").removeClass("active"); $(".footer-link .links-a").eq($(this).index()).addClass("active"); }); // 开班信息模块 function kbxx () { // var courseId = // arguments.length > 0 && arguments[0] !== undefined // ? arguments[0] // : 13; var cityId = arguments[0] !== undefined ? arguments[0] : 10; $.ajax({ url: "http://api-newzs.1000phone.net/v1/api/openApiRestController/getAllClass?type=1", type: "GET", success: function success (res) { var r = ""; var curTime = new Date().getTime(); var filterArr = res.data.filter(function (v) { return v.cityId == cityId; }); console.log(filterArr); filterArr.reverse().forEach(function (v, idx) { // 最大条数 if (idx > 14) return; // 判断时间 var timeMode = "预约占座"; var kbTime = new Date(v.beginTime).getTime(); // 一个月 if (kbTime - curTime > 2592000000) { timeMode = "预约占座"; } if (kbTime - curTime > 0 && kbTime - curTime < 2642268030) { timeMode = "即将报满"; } if (kbTime - curTime < 0) { timeMode = "爆满开班"; } r += "<li class='swiper-slide'>\n <a href='javascript:;' rel='nofollow' onclick='open53_pc()'>\n <span>" + (v.name.replace(v.cityName, "").split("班")[0] + "班") + "</span>\n <span>" + v.beginTime + "</span>\n <span data-mode='" + (timeMode === "即将报满" ? 0 : timeMode === "爆满开班" ? 2 : 1) + "'>" + timeMode + " " + (timeMode === "即将报满" ? "" : "") + "</span>\n </a>\n </li>"; }); $(".des-right-classes .swiper-wrapper").html(r); new Swiper(".swiper6", { slidesPerView: 5, slidesPerGroup: 5, spaceBetween: 10, loop: true, autoplay: true, direction: "vertical", }); }, }); } kbxx(10); $(".kbxx_showXq_btn").click(function () { $(".kbxx_showXq_box").css("display", "block"); }); $(".kbxx_showXq_box ul li").click(function () { kbxx($(this).data("cityid")); $(".choose-xq").html($(this).context.innerText); $(".kbxx_showXq_box").css("display", "none"); }); if ( $(".content-left-box-child").height() > $(".content-right-box-child").height() ) { $(".content-right-box-child").addClass("sticky"); } else if ( $(".content-left-box-child").height() < $(".content-right-box-child").height() ) { $(".content-left-box-child").addClass("sticky"); } </script> </body> </html>

web前端开发要学的课程