課程亮點

1

理論與實踐并重,真正注重實用技術(shù)培養(yǎng)

適用對象

1

零基礎(chǔ)

課程內(nèi)容

前端頁面重構(gòu):

本章是前端入門章節(jié),主要介紹靜態(tài)頁面布局的實現(xiàn),包括PC端布局、移動端布局和響應(yīng)式布局。學(xué)完本階段課程能夠獨立把設(shè)計師給的PSD效果圖轉(zhuǎn)換為靜態(tài)代碼頁面,具備PC端和移動端靜態(tài)頁面的開發(fā)能力,并可以適配不同的終端設(shè)備。

學(xué)習(xí)內(nèi)容:

HTML:HTML簡介、語法、屬性和值、注釋、基本結(jié)構(gòu)、常用標(biāo)簽、語義化

CSS:基本語法、選擇器、文本屬性、盒模型、浮動及清除浮動、position定位、瀏覽器兼容、CSS hack、CSS高級技巧、BFC規(guī)范

HTML5:HTML5簡介、新增的結(jié)構(gòu)化標(biāo)簽、音頻和視頻、新增表單元素、新增表單屬性、html5shiv.js

CSS3:css3新增選擇器、背景和漸變、用戶界面屬性、多列布局、圓角和陰影、過渡動畫、2D與3D轉(zhuǎn)換、彈性盒布局、Grid網(wǎng)格布局、流式布局

Less:css預(yù)處理、Less編輯、Koala編譯工具、導(dǎo)入、注釋、變量、混合、嵌套、運算、內(nèi)置函數(shù)

Photoshop:PS基本操作、psd文件、網(wǎng)頁圖片優(yōu)化技巧、圖片格式分類及特性、GIF動態(tài)制作、一鍵切圖插件

頁面布局與屏幕適配:移動端瀏覽器及內(nèi)核分析、viewport設(shè)置、Retina高清屏、PPI、dpr設(shè)備像素比解析、媒體查詢、vw+rem布局、flexible.js+rem布局、媒體查詢+rem、移動端reset

實戰(zhàn)項目:

PC端項目:小U課堂靜態(tài)頁面布局、移動端項目:小U商城移動端項目、響應(yīng)式項目:小U商城后臺管理系統(tǒng)