前端開發大勢所趨,行業紅利唾手可得!

前端初窺,基礎入門篇,實現互聯網+上你所看見的一切

珠峰培訓零基礎前端開發“PC端+移動端+響應式開發”課程

第一周CSS基本入門篇

第一天
  • 初識前端
  • 編輯工具
  • 前端開發環境—浏覽器
  • markdown的安裝及使用
  • 什麽是語言
  • 網頁的基本組成
  • HTML基礎
  • 標簽的分類
  • 標簽屬性
  • 元素及元素分類
  • 常用HTML4標簽
  • 綜合實戰【珠峰故事】
...
第二天
  • 文檔聲明類型
  • 無序列表
  • 有序列表
  • 自定義列表
  • 淺析SEO
  • table表格
  • form表單元素
  • 詳解單選多選按鈕
  • table表格實戰
  • 利用form表單制作登陸頁
...
第三天
  • CSS作用
  • CSS引入方式
  • CSS選擇器語法
  • CSS選擇器詳解
  • 基本選擇器
  • 關系選擇器
  • 屬性選擇器
  • 僞類選擇器
  • 僞元素選擇器
  • CSS實戰練習
...
第四天
  • 絕對路徑和相對路徑
  • HTML元素的分類
  • 塊元素的特性
  • 行內元素特性
  • 行內塊元素特性
  • CSS之display詳解
  • display與visibility區別
  • 下拉菜單實戰練習
  • 橫向導航菜單實戰練習
...
第五天
  • 基線對齊問題
  • CSS盒子模型
  • 利用border制作三角形
  • margin塌陷問題
  • margin重疊問題
  • 盒子模型計算公式
  • 盒模型綜合實戰練習
...

第二周綜合實戰篇

第一天
  • 標准文檔流及特性
  • CSS中三種基本定位機制
  • 浮動的基本語法
  • 浮動的應用:圖文環繞
  • 清除浮動的方法
  • BFC詳解
  • 單行文本省略號實現方式
  • PC端項目導航的制作
...
第二天
  • 設計圖結構解析
  • 項目目錄結構的搭建
  • background詳解
  • 背景複合屬性
  • ps使用方法
  • 融合ps開始實戰
...
第三天
  • 定位元素特性
  • 絕對定位詳解
  • 相對定位詳解
  • 固定定位詳解
  • z-index層級關系
  • 自然堂官網實戰
  • 百分比布局詳解
...
第四天
  • Color的幾種表示方式
  • css Font字體整理
  • CSS樣式之Text文本設置
  • reset重置樣式表詳解
  • 項目內容列表實戰
  • 結構複用
...
第五天
  • 雪碧圖的使用和制作方法
  • 網站底部實戰
  • 版權特殊符號
  • CSS hack詳解
  • 完善網站
  • 總結前期知識點
...

第三周移動端及響應式開發篇

第一天
  • HTML5新增結構標簽
  • audio和video詳解
  • CSS命名規範
  • HTML5新增標簽兼容處理
  • border-radius屬性詳解
  • 怪異盒模型詳解
  • box-shadow屬性詳解
  • text-shadow屬性詳解
  • 視口viewport深入理解
...
第二天
  • 媒體查詢詳解
  • 移動端頁面設計規範
  • 移動端頁面分析
  • 摩拜單車網站實戰
  • 居中對齊總結
  • background新增CSS3屬性
...
第三天
  • rem及百分比布局/li>
  • CSS3選擇器
  • 自定義字體 @font-face
  • 摩拜單車網站實戰
  • swiper的使用
  • 熊貓壓縮工具的使用
第四天
  • CSS實現自定義單選按鈕
  • CSS實現自定義多選按鈕
  • CSS實現自定義開關
  • 彈性盒模型
  • 盒模型居中對齊屬性
  • 珠峰課程頁面實戰
...
第五天
  • transform詳解
  • transition詳解
  • animation詳解
  • linear-gradient詳解
  • radial-gradient詳解
  • animation詳解
  • 夢幻西遊頁面的實戰
...

學習目標

三周課程結束,你將會獨立完成例如京東首頁,淘寶首頁,百度首頁等靜態頁面,給你的後期學習打下堅實基礎

HTML+CSS常見問題