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