課程亮點(diǎn)
1
理論與實(shí)踐并重,真正注重實(shí)用技術(shù)培養
適用對象
1
零基礎
課程內容
前端頁(yè)面重構:
本章是前端入門(mén)章節,主要介紹靜態(tài)頁(yè)面布局的實(shí)現,包括PC端布局、移動(dòng)端布局和響應式布局。學(xué)完本階段課程能夠獨立把設計師給的PSD效果圖轉換為靜態(tài)代碼頁(yè)面,具備PC端和移動(dòng)端靜態(tài)頁(yè)面的開(kāi)發(fā)能力,并可以適配不同的終端設備。
學(xué)習內容:
HTML:HTML簡(jiǎn)介、語(yǔ)法、屬性和值、注釋、基本結構、常用標簽、語(yǔ)義化
CSS:基本語(yǔ)法、選擇器、文本屬性、盒模型、浮動(dòng)及清除浮動(dòng)、position定位、瀏覽器兼容、CSS hack、CSS高級技巧、BFC規范
HTML5:HTML5簡(jiǎn)介、新增的結構化標簽、音頻和視頻、新增表單元素、新增表單屬性、html5shiv.js
CSS3:css3新增選擇器、背景和漸變、用戶(hù)界面屬性、多列布局、圓角和陰影、過(guò)渡動(dòng)畫(huà)、2D與3D轉換、彈性盒布局、Grid網(wǎng)格布局、流式布局
Less:css預處理、Less編輯、Koala編譯工具、導入、注釋、變量、混合、嵌套、運算、內置函數
Photoshop:PS基本操作、psd文件、網(wǎng)頁(yè)圖片優(yōu)化技巧、圖片格式分類(lèi)及特性、GIF動(dòng)態(tài)制作、一鍵切圖插件
頁(yè)面布局與屏幕適配:移動(dòng)端瀏覽器及內核分析、viewport設置、Retina高清屏、PPI、dpr設備像素比解析、媒體查詢(xún)、vw+rem布局、flexible.js+rem布局、媒體查詢(xún)+rem、移動(dòng)端reset
實(shí)戰項目:
PC端項目:小U課堂靜態(tài)頁(yè)面布局、移動(dòng)端項目:小U商城移動(dòng)端項目、響應式項目:小U商城后臺管理系統