本書是一本專注于HTML5、CSS3、jQuery開發(fā)和Bootstrap相關(guān)內(nèi)容開發(fā)的活頁式教材, 內(nèi)容涉及Web前端開發(fā)與設計、主流頁面布局方法、導航菜單制作、圖文排版、頁面交互等方面的基礎知識, 突出內(nèi)容的實用性和實踐性,堅持以職業(yè)能力為本位,以滿足職業(yè)崗位的需要,與相應的“1+X”證書標準接軌。本書有效融入課程思政, 并突出其職業(yè)引導功能。讀者通過教材了解職業(yè)、熱愛職業(yè)崗位,樹立正確的價值觀、擇業(yè)觀, 形成良好的職業(yè)道德和職業(yè)意識。
本書的編寫從滿足Web前端開發(fā)工程師崗位的技術(shù)和能力需求出發(fā)，系統(tǒng)深入地介紹了Web前端開發(fā)的基礎知識與前沿技術(shù)，還融入了《Web前端開發(fā)職業(yè)技能等級標準》中的職業(yè)素養(yǎng)和崗位技術(shù)技能，以專業(yè)技能為模塊、以項目任務為驅(qū)動、以課程思政為綱要進行組織編寫。為落實“黨的二十大精神”課程思政元素的實施方案，以堅持立德樹人為根本任務，從愛國情懷、民族自信、社會責任、法制意識、工業(yè)文化、職業(yè)態(tài)度、職業(yè)素養(yǎng)等方面著眼，以學生綜合職業(yè)能力培養(yǎng)為中心推進編寫工作。幫助學習者有效提升Web前端開發(fā)能力，確保學習者擁有最關(guān)鍵的Web前端開發(fā)工程師崗位技能；提升個人生活質(zhì)量與升學、就業(yè)、職場競爭力。
本書組織方式
本書共六個模塊，主要介紹HTML+CSS+jQuery+Bootstrap前端技術(shù)基礎知識，具體包括初識HTML、構(gòu)建HTML網(wǎng)頁文件、CSS新樣式修飾網(wǎng)頁、盒子模型、元素的浮動與定位、網(wǎng)頁布局技術(shù)、網(wǎng)頁表單的應用、跨平臺響應式技術(shù)等。其中模塊六為綜合實戰(zhàn)篇，其目的是實現(xiàn)特產(chǎn)網(wǎng)系統(tǒng)的開發(fā)。
本書特色內(nèi)容
書中運用二維碼呈現(xiàn)微課視頻，掃碼即可查看與圖書內(nèi)容深度融合的精彩紛呈的微課視頻。
章節(jié)具體結(jié)構(gòu)如下：
核心概念：章節(jié)職業(yè)能力中重要概念、關(guān)鍵詞的解釋或定義。
學習目標：重點要掌握的基礎知識和操作技巧，進行點睛指引。
基本知識：章節(jié)職業(yè)能力中涉及的知識點與技能點。
活動組織：引入案例，并結(jié)合案例提出一些問題，引發(fā)學生思考，激發(fā)學生學習興趣。在項目活動組織中提高學生的動手能力和創(chuàng)新能力，培養(yǎng)學生的邏輯分析能力與解決實際問題的能力，逐步將學生培養(yǎng)成兼具基礎素養(yǎng)、邏輯思維、設計能力以及應用創(chuàng)新能力的綜合性人才，初步具備Web應用開發(fā)程序員的素質(zhì)。
模塊一 Web前端開發(fā)的準備
任務1．1 Web相關(guān)概念
職業(yè)能力1．1．1 掌握Web前端開發(fā)基本概念
職業(yè)能力1．1．2 了解常用Web前端開發(fā)工具
模塊二 使用HTML5建立網(wǎng)頁結(jié)構(gòu)
任務2．1 初識HTML
職業(yè)能力2．1．1 HTML基本語法
職業(yè)能力2．1．2 HTML的主體元素
任務2．2 HTML常用標簽
職業(yè)能力2．2．1 文本、圖像
職業(yè)能力2．2．2 超鏈接、音頻、視頻
職業(yè)能力2．2．3 列表、表格
職業(yè)能力2．2．4 表單
模塊三 使用CSS3樣式修飾網(wǎng)頁
任務3．1 初識CSS
職業(yè)能力3．1．1 CSS樣式基本語法結(jié)構(gòu)
職業(yè)能力3．1．2 CSS的選擇器
任務3．2 CSS常用樣式
職業(yè)能力3．2．1 CSS樣式的單位和顏色
職業(yè)能力3．2．2 文本與字體樣式
職業(yè)能力3．2．3 背景樣式
職業(yè)能力3．2．4 列表樣式
職業(yè)能力3．2．5 表格樣式
任務3．3 定位與布局
職業(yè)能力3．3．1 盒子模型
職業(yè)能力3．3．2 定位方式
職業(yè)能力3．3．3 彈性盒子布局
職業(yè)能力3．3．4 響應式布局
任務3．4 CSS3
職業(yè)能力3．4．1 邊框和陰影
職業(yè)能力3．4．2 2D和3D變換
職業(yè)能力3．4．3 過渡和動畫
模塊四 輕量級框架應用
任務4．1 jQuer基礎
職業(yè)能力4．1．1 在網(wǎng)頁中使用JavaScript的語句
職業(yè)能力4．1．2 使用BOM對象與瀏覽器窗口交互
職業(yè)能力4．1．3 使用DOM對象改變文檔對象
職業(yè)能力4．1．4 在網(wǎng)頁中使用jQuery框架
職業(yè)能力4．1．5 使用jQuer在網(wǎng)頁中添加事件
任務4．2 jQuery效果
職業(yè)能力4．2．1 使用jQuer操作網(wǎng)頁樣式
職業(yè)能力4．2．2 使用jQuer添加動畫
任務4．3 jQueryAJAX
職業(yè)能力4．3．1 在網(wǎng)頁中使用AJAX
模塊五 響應式開發(fā)技術(shù)
任務5．1 Bootstrap基本架構(gòu)
職業(yè)能力5．1．1 在頁面中引入Bootstrap
職業(yè)能力5．1．2 使用Bootstrap的柵格系統(tǒng)搭建網(wǎng)頁結(jié)構(gòu)
任務5．2 Bootstrap樣式
職業(yè)能力5．2．1 使用Bootstrap的文本與顏色樣式
職業(yè)能力5．2．2 使用Bootstrap的圖文樣式
職業(yè)能力5．2．3 使用Bootstrap的表格樣式與列表樣式
職業(yè)能力5．2．4 使用Bootstrap制作表單
任務5．3 Bootstrap組件
職業(yè)能力5．3．1 使用Bootstrap的按鈕和按鈕組快捷開發(fā)
職業(yè)能力5．3．2 使用Bootstrap的導航樣式
職業(yè)能力5．3．3 使用Bootstrap徽章、警告窗和卡片樣式
職業(yè)能力5．3．4 使用Bootstrap制作輪播圖
模塊六 綜合項目實戰(zhàn)
任務6．1 特產(chǎn)網(wǎng)網(wǎng)站項目分析
職業(yè)能力6．1．1 進行網(wǎng)站整體規(guī)劃
任務6．2 網(wǎng)頁實現(xiàn)
職業(yè)能力6．2．1 實現(xiàn)導航欄和輪播圖模塊
職業(yè)能力6．2．2 實現(xiàn)特產(chǎn)展示模塊
職業(yè)能力6．2．3 實現(xiàn)特產(chǎn)網(wǎng)新聞模塊
職業(yè)能力6．2．4 實現(xiàn)頁腳和版權(quán)信息模塊
書單推薦
