教程名稱：
xa0 xa0 xa0xa0一套代碼多端適配 前端工程師必備 響應(yīng)式開(kāi)發(fā)一招制勝
課程內(nèi)容：
xa0 xa0 不要在意設(shè)備尺寸，這套多終端適配帶給你用戶體驗(yàn)和開(kāi)發(fā)效率的終極感受。為項(xiàng)目做各種端的適配問(wèn)題是很多前端工程師很頭疼的問(wèn)題。本項(xiàng)目基于互聯(lián)網(wǎng)金融站做一套多端適配響應(yīng)式的網(wǎng)頁(yè)。涵蓋了響應(yīng)式的全部知識(shí)點(diǎn)，不局限于開(kāi)發(fā)同時(shí)囊括了產(chǎn)品、設(shè)計(jì)、流程等一整套模式一門課程全覆蓋教學(xué)。任何有基礎(chǔ)沒(méi)基礎(chǔ)的讓你學(xué)完就會(huì)響應(yīng)式開(kāi)發(fā)。學(xué)完一定讓你對(duì)響應(yīng)式開(kāi)發(fā)感觸頗深，并將響應(yīng)式開(kāi)發(fā)應(yīng)用到你自己的項(xiàng)目中。
課程目錄：
第一節(jié)、前期準(zhǔn)備
介紹了課程內(nèi)容、背景和案例展示、什么是響應(yīng)式網(wǎng)站、怎樣分析設(shè)計(jì)圖、響應(yīng)式網(wǎng)站設(shè)計(jì)實(shí)踐原則
第二節(jié)、如何組織項(xiàng)目目錄結(jié)構(gòu)
介紹了約定優(yōu)于配置的思想，常見(jiàn)的項(xiàng)目目錄和文件的組織方式，一些基本文件的作用等知識(shí)，為編碼開(kāi)始做準(zhǔn)備。
第三節(jié)、開(kāi)始編寫HTML代碼
根據(jù)設(shè)計(jì)圖一步一步實(shí)現(xiàn)基本的HTML結(jié)構(gòu)，介紹了文檔類型、meta聲明、IE條件表達(dá)式、html5新標(biāo)簽、語(yǔ)義化選擇、大綱等知識(shí)。
第四節(jié)、如何實(shí)現(xiàn)PC端的樣式
一步一步實(shí)現(xiàn)PC端的樣式，介紹了CSS Resets和Normalize，相對(duì)單位和其中的一些坑，清除浮動(dòng)的幾種方式，塊級(jí)格式化上下文（BFC），inline-block的空白問(wèn)題，CSS Sprites，盒模型計(jì)算，自動(dòng)前綴（autoprefixer）等知識(shí)。
第五節(jié)、如何實(shí)現(xiàn)移動(dòng)端的樣式
一步一步實(shí)現(xiàn)移動(dòng)端的樣式，介紹了Chrome的響應(yīng)式調(diào)試工具，媒體查詢中使用相對(duì)單位，CSS3選擇器，CSS打印相關(guān)屬性等知識(shí)。
第六節(jié)、如何實(shí)現(xiàn)響應(yīng)式廣告及響應(yīng)式圖片
一步一步實(shí)現(xiàn)響應(yīng)式滾動(dòng)廣告，介紹了如何選擇第三方組件，OwlCarousel2的使用等知識(shí)。介紹了響應(yīng)式圖片實(shí)現(xiàn)的幾種方式，picture/srcset/size標(biāo)簽如何使用，svg原理和制作方式，polyfill原理，picturefill的使用，圖片壓縮等知識(shí)。
第七節(jié)、Node.js簡(jiǎn)介
介紹了Node.js的基本知識(shí)，同步異步編程方式的區(qū)別，包管理器NPM的使用，package.json如何配置，簡(jiǎn)單httpserver的使用等知識(shí)。
第八節(jié)、如何處理兼容性及在多個(gè)設(shè)備上進(jìn)行調(diào)試
介紹了處理兼容性的主要技術(shù)，包含調(diào)試的方法，虛擬機(jī)的使用，CSS hacks，polyfill和shim，Modernizr，兼容性查詢等知識(shí)。
第九節(jié)、如何打包發(fā)布
介紹了前端自動(dòng)化的概念，grunt/gulp/webpack，如何使用Gulp進(jìn)行自動(dòng)化打包發(fā)布等知識(shí)
第十節(jié)、課程擴(kuò)展1 — 選擇一個(gè)趁手的IDE
選擇一個(gè)趁手的IDE，WebStorm。介紹了使用框架的注意事項(xiàng)，Bootstrap、SemanticUI、Foundation、PureCSS等響應(yīng)式框架的特點(diǎn)和優(yōu)缺點(diǎn)等。
第十一節(jié)、課程擴(kuò)展2 — 聊聊原型設(shè)計(jì)和切圖
介紹了原型設(shè)計(jì)的概念和工具，Axure等工具的使用，如何切圖，Photoshop的使用，Sketch的使用等知識(shí)。
第十二節(jié)、課程大作業(yè)
根據(jù)講師所講知識(shí)，獨(dú)立做出與課程相似的響應(yīng)式頁(yè)面
