教育行業(yè)A股IPO第一股(股票代碼 003032)

全國(guó)咨詢/投訴熱線:400-618-4000

移動(dòng)web開發(fā)實(shí)戰(zhàn)

更新時(shí)間:2023年04月18日16時(shí)51分 來源:傳智教育 瀏覽次數(shù):

好口碑IT培訓(xùn)

  課程簡(jiǎn)介:

  本課程采用2+5模式, 前兩天承接HTML+CSS, 使用字體圖標(biāo)、平面轉(zhuǎn)換、動(dòng)畫等,豐富網(wǎng)頁(yè)效果和呈現(xiàn)方式;后5天完成移動(dòng)端和多端適配效果。課程采用閉環(huán)方式設(shè)計(jì),每天課程都有完整的案例或項(xiàng)目, 讓學(xué)生學(xué)以致用。

  講解方式:

  每章節(jié)都配備綜合案例,學(xué)完即練習(xí)企業(yè)級(jí)項(xiàng)目,讓學(xué)生不僅掌握知識(shí)點(diǎn),還能學(xué)到知識(shí)點(diǎn)在實(shí)際開發(fā)中的應(yīng)用場(chǎng)景。

  課程亮點(diǎn):

  1. 實(shí)戰(zhàn)式教學(xué):每章節(jié)案例都取自一線大廠;

  2. 多元化項(xiàng)目:項(xiàng)目選型涵蓋企業(yè)站、電商站、門戶網(wǎng)站等等;


只要大家有需求

我們的視頻教程就絕不會(huì)缺席

黑馬程序員重磅發(fā)布新教程

  課程內(nèi)容:

  1.字體圖標(biāo)

  2.CSS3平面、空間轉(zhuǎn)換;

  3.CSS3動(dòng)畫;

  4.Flex布局;

  5.Rem布局;

  6.Less;

  7.二倍圖;

  8.vw / vh布局;

  9.媒體查詢;

  10.bootstrap框架;

  11.響應(yīng)式網(wǎng)頁(yè)布局;

  程目錄  

  移動(dòng)Web實(shí)戰(zhàn)(滑動(dòng)查看)

  第1節(jié) - 階段課程介紹

  第2節(jié) - 今日課程介紹

  第3節(jié) - 字體圖標(biāo)-基本使用

  第4節(jié) - 字體圖標(biāo)-iconfont類

  第5節(jié) - 案例-購(gòu)物車

  第6節(jié) - 07字體圖標(biāo)-svg-上傳

  第7節(jié) - 平面轉(zhuǎn)換-介紹

  第8節(jié) - 平面轉(zhuǎn)換-位移

  第9節(jié) - 平面轉(zhuǎn)換-位移-技巧

  第10節(jié) - 平面轉(zhuǎn)換-定位盒子居中

  第11節(jié) - 案例-雙開門-布局

  第12節(jié) - 案例-雙開門-hover效果

  第13節(jié) - 平面轉(zhuǎn)換旋轉(zhuǎn)

  第14節(jié) - 平面轉(zhuǎn)換-轉(zhuǎn)換原點(diǎn)

  第15節(jié) - 平面轉(zhuǎn)換-多重轉(zhuǎn)換

  第16節(jié) - 平面轉(zhuǎn)換-縮放

  第17節(jié) - 案例-縮放

  第18節(jié) - 案例-縮放-注意點(diǎn)-層疊性

  第19節(jié) - 漸變

  第20節(jié) - 案例-漸變

  第21節(jié) - 綜合案例-華為-結(jié)構(gòu)分析

  第22節(jié) - 綜合案例-華為-mask

  第23節(jié) - 綜合案例-華為-hover效果

  第24節(jié) - 今日課程介紹

  第25節(jié) - 空間轉(zhuǎn)換-簡(jiǎn)介

  第26節(jié) - 空間轉(zhuǎn)換-位移

  第27節(jié) - 空間轉(zhuǎn)換-透視屬性

  第28節(jié) - 空間轉(zhuǎn)換-透視屬性-原理

  第29節(jié) - 空間轉(zhuǎn)換-rotateZ

  第30節(jié) - 空間轉(zhuǎn)換-rotateX

  第31節(jié) - 空間轉(zhuǎn)換-rotateY

  第32節(jié) - 空間轉(zhuǎn)換-左手法則

  第33節(jié) - 空間轉(zhuǎn)換-rotate3d-了解

  第34節(jié) - 空間轉(zhuǎn)換-立體呈現(xiàn)

  第35節(jié) - 3d導(dǎo)航-結(jié)構(gòu)分析

  第36節(jié) - 3d導(dǎo)航-搭建立方體

  第37節(jié) - 3d導(dǎo)航-hover

  第38節(jié) - 上午回顧

  第39節(jié) - 空間轉(zhuǎn)換-縮放

  第40節(jié) - 動(dòng)畫-簡(jiǎn)介

  第41節(jié) - 動(dòng)畫-from..to

  第42節(jié) - 動(dòng)畫-百分比

  第43節(jié) - 動(dòng)畫-animation復(fù)合屬性01

  第44節(jié) - 動(dòng)畫-animation復(fù)合屬性02

  第45節(jié) - 動(dòng)畫-animation拆分寫法

  第46節(jié) - 動(dòng)畫-逐幀動(dòng)畫-簡(jiǎn)介

  第47節(jié) - 動(dòng)畫-逐幀動(dòng)畫-實(shí)現(xiàn)

  第48節(jié) - 動(dòng)畫-多組動(dòng)畫

  第49節(jié) - 綜合案例-走馬燈

  第50節(jié) - 綜合案例-全民出游-背景大圖

  第51節(jié) - 綜合案例-全民出游-云彩-布局

  第52節(jié) - 綜合案例-全民出游-云彩-動(dòng)畫

  第53節(jié) - 考試題

  第54節(jié) - 課程介紹

  第55節(jié) - 課程知識(shí)介紹

  第56節(jié) - PC和移動(dòng)網(wǎng)頁(yè)不同點(diǎn)

  第57節(jié) - 谷歌模擬器

  第58節(jié) - 分辨率

  第59節(jié) - 代碼參考分辨率-邏輯

  第60節(jié) - 視口

  第61節(jié) - 二倍圖

  第62節(jié) - 百分比布局

  第63節(jié) - Flex-體驗(yàn)

  第64節(jié) - Flex-簡(jiǎn)介

  第65節(jié) - Flex-組成

  第66節(jié) - Flex-主軸對(duì)齊方式

  第67節(jié) - Flex-側(cè)軸對(duì)齊方式

  第68節(jié) - Flex-單獨(dú)控制某個(gè)盒子側(cè)軸對(duì)齊方式

  第69節(jié) - Flex-彈性盒子尺寸特點(diǎn)

  第70節(jié) - Flex-彈性伸縮比

  第71節(jié) - 小兔鮮兒-確認(rèn)訂單-準(zhǔn)備工作

  第72節(jié) - 小兔鮮兒-確認(rèn)訂單-整體布局

  第73節(jié) - 小兔鮮兒-確認(rèn)訂單-底部支付-布局

  第74節(jié) - 小兔鮮兒-確認(rèn)訂單-底部支付-左側(cè)

  第75節(jié) - 小兔鮮兒-確認(rèn)訂單-底部支付-右側(cè)

  第76節(jié) - 小兔鮮兒-確認(rèn)訂單-用戶信息-整體布局

  第77節(jié) - 小兔鮮兒-確認(rèn)訂單-用戶信息-內(nèi)容布局

  第78節(jié) - 小兔鮮兒-確認(rèn)訂單-用戶信息-文字內(nèi)容

  第79節(jié) - 課程介紹

  第80節(jié) - 小兔鮮兒-商品-布局

  第81節(jié) - 小兔鮮兒-商品-數(shù)量

  第82節(jié) - 小兔鮮兒-商品-描述

  第83節(jié) - 小兔鮮兒-其他信息-布局

  第84節(jié) - 小兔鮮兒-其他信息-內(nèi)容

  第85節(jié) - Flex-修改主軸方向

  第86節(jié) - Flex-主軸方向和對(duì)齊方式

  第87節(jié) - Flex-彈性盒子換行

  第88節(jié) - Flex-調(diào)整行對(duì)齊方式

  第89節(jié) - 小兔鮮兒-pc-項(xiàng)目介紹

  第90節(jié) - 小兔鮮兒-pc-背景

  第91節(jié) - 小兔鮮兒-pc-內(nèi)容布局

  第92節(jié) - 小兔鮮兒-pc-賬戶概覽-布局

  第93節(jié) - 小兔鮮兒-pc-賬戶概覽-內(nèi)容

  第94節(jié) - 小兔鮮兒-pc-賬戶概覽-圖片尺寸

  第95節(jié) - 小兔鮮兒-pc-公共面板-布局

  第96節(jié) - 小兔鮮兒-pc-公共面板-文字樣式

  第97節(jié) - 小兔鮮兒-pc-訂單-li布局

  第98節(jié) - 小兔鮮兒-pc-訂單-內(nèi)容布局

  第99節(jié) - 小兔鮮兒-pc-訂單-goods

  第100節(jié) - 小兔鮮兒-pc-訂單-goods-省略號(hào)

  第101節(jié) - 小兔鮮兒-pc-訂單-common

  第102節(jié) - 移動(dòng)適配

  第103節(jié) - 今日課程介紹

  第104節(jié) - 體驗(yàn)rem移動(dòng)適配

  第105節(jié) - rem-基本使用

  第106節(jié) - rem-媒體查詢

  第107節(jié) - rem-移動(dòng)適配

  第108節(jié) - rem-布局流程

  第109節(jié) - rem-flexible移動(dòng)適配

  第110節(jié) - Less-體驗(yàn)

  第111節(jié) - Less-簡(jiǎn)介

  第112節(jié) - Less-EasyLess插件

  第113節(jié) - Less-注釋

  第114節(jié) - Less-計(jì)算

  第115節(jié) - Less-嵌套

  第116節(jié) - Less-變量

  第117節(jié) - Less-導(dǎo)入

  第118節(jié) - Less-導(dǎo)出-插件配置

  第119節(jié) - Less-導(dǎo)出-單獨(dú)路徑

  第120節(jié) - Less-禁止導(dǎo)出

  第121節(jié) - 游樂園-項(xiàng)目準(zhǔn)備

  第122節(jié) - 游樂園-Less-導(dǎo)入

  第123節(jié) - 游樂園-整體布局

  第124節(jié) - 游樂園-根字號(hào)變量

  第125節(jié) - 游樂園-banner區(qū)域

  第126節(jié) - 游樂園-活動(dòng)標(biāo)題

  第127節(jié) - 游樂園-活動(dòng)-布局

  第128節(jié) - 游樂園-活動(dòng)-字體圖標(biāo)

  第129節(jié) - 游樂園-活動(dòng)-狀態(tài)-藍(lán)色

  第130節(jié) - 游樂園-活動(dòng)-狀態(tài)-灰色

  第131節(jié) - 游樂園-活動(dòng)-文字-top

  第132節(jié) - 游樂園-活動(dòng)-文字-bottom

  第133節(jié) - 游樂園-活動(dòng)-內(nèi)容復(fù)制

  第134節(jié) - 游樂園-活動(dòng)-底部工具欄

  第135節(jié) - vw-體驗(yàn)

  第136節(jié) - vh-體驗(yàn)

  第137節(jié) - vw-移動(dòng)適配

  第138節(jié) - vh-移動(dòng)適配

  第139節(jié) - vh-全面屏影響

  第140節(jié) - B站-獲取素材

  第141節(jié) - B站-項(xiàng)目準(zhǔn)備

  第142節(jié) - B站-頭部-布局

  第143節(jié) - B站-vw變量

  第144節(jié) - B站-頭部-logo圖標(biāo)

  第145節(jié) - B站-頭部-right內(nèi)容

  第146節(jié) - B站-頭部-更多

  第147節(jié) - B站-頭部-字體圖標(biāo)字號(hào)

  第148節(jié) - B站-頭部-tab

  第149節(jié) - B站-視頻-布局

  第150節(jié) - B站-視頻-思路

  第151節(jié) - B站-視頻-介紹文字

  第152節(jié) - B站-視頻-數(shù)量統(tǒng)計(jì)

  第153節(jié) - B站-視頻-彈性盒子換行

  第154節(jié) - B站-頭部-層級(jí)和背景色

  第155節(jié) - 課程介紹

  第156節(jié) - 媒體查詢-max-min-width

  第157節(jié) - 媒體查詢-書寫順序

  第158節(jié) - 了解-媒體查詢-完整寫法

  第159節(jié) - 媒體查詢-link寫法

  第160節(jié) - 媒體查詢-隱藏

  第161節(jié) - bootstrap-體驗(yàn)

  第162節(jié) - bootstrap-簡(jiǎn)介

  第163節(jié) - bootstrap-下載

  第164節(jié) - bootstrap-使用

  第165節(jié) - bootstrap-柵格系統(tǒng)-原理

  第166節(jié) - bootstrap-柵格系統(tǒng)-代碼

  第167節(jié) - bootstrap-柵格系統(tǒng)-其他類名

  第168節(jié) - bootstrap-介紹

  第169節(jié) - bootstrap-表格

  第170節(jié) - bootstrap-按鈕

  第171節(jié) - bootstrap-組件

  第172節(jié) - bootstrap-字體圖標(biāo)

  第173節(jié) - bootstrap-插件-下拉菜單

  第174節(jié) - bootstrap-插件-輪播圖

  第175節(jié) - AlloyTeam-項(xiàng)目準(zhǔn)備

  第176節(jié) - AlloyTeam-banner圖-高度

  第177節(jié) - AlloyTeam-頭部-組件

  第178節(jié) - AlloyTeam-頭部-樣式

  第179節(jié) - bootstrap-定制-項(xiàng)目導(dǎo)航

  第180節(jié) - AlloyTeam-開源項(xiàng)目-標(biāo)題文字

  第181節(jié) - AlloyTeam-開源項(xiàng)目-柵格布局

  第182節(jié) - AlloyTeam-開源項(xiàng)目-內(nèi)容

  第183節(jié) - bootstrap-全局樣式

  未完待續(xù),黑馬老師996更新中......


掌握行業(yè)熱門技術(shù)

是每個(gè)程序員都應(yīng)該重視的事情

移動(dòng)web開發(fā)實(shí)戰(zhàn)如此重要,你還沒學(xué)?

點(diǎn)擊或搜索黑馬程序員B站

觀看全集視頻

- 完整配套資料領(lǐng)取方式 -

(視頻+講義+源碼+筆記+資料)

黑馬程序員視頻庫(kù)

搜索《移動(dòng)web開發(fā)實(shí)戰(zhàn)

0 分享到:
和我們?cè)诰€交談!