2021-3-23 前端達(dá)人
零基礎(chǔ)如何快速入「]前端?這個(gè)問題往往是沒有基礎(chǔ)會遇到的，想要快速入「門前端開發(fā)，簡單來說就是要把基礎(chǔ)的知識點(diǎn)掌握熟練，然后由淺入深的去學(xué)習(xí)，在這里根據(jù)我過來的經(jīng)驗(yàn)，為大家簡單介紹一下零基礎(chǔ)如何快速入門前端。
舉個(gè)可能不太恰當(dāng)?shù)睦?前端就好比如蓋房子，html就充當(dāng) 了房子結(jié)構(gòu)這部分，也是房子的基礎(chǔ)。css呢， 就好比咱們房子的裝修,墻面什么顏色，什么風(fēng)格，什么地板等等，這些給房子改變風(fēng)格,樣式的就是css。而Java呢，就好比這個(gè)房子的功能，房子需要制冷吧，需要暖氣吧，也需要上下水吧。這些功能性的就相當(dāng)于是Java。
一、前端工具（dreamwear/sublime/Photoshop/SVN等）
二、零基礎(chǔ)入門（HTML，CSS）
1、前端開發(fā)概況、代碼入門
頁面基本結(jié)構(gòu)、文檔聲明、編碼聲明、css語法、style屬性、link和style標(biāo)簽、id屬性、基本樣式、Border 、Background、 Font、盒模型、文本設(shè)置等等。
2、常用標(biāo)簽集合
header、article、aside、section、footer、nav、h1-h6、p、ul、ol、li、img、dl、dt、dd…絕對路徑、相對路徑、標(biāo)簽語義化、標(biāo)簽嵌套規(guī)范、SEO…
3、常用選擇器&標(biāo)簽類型劃分
d、class、類型選擇、包含選擇、群組選擇、通配符、選擇器優(yōu)先級、標(biāo)簽樣式初始化訂制方案、超鏈接及偽類劃分、標(biāo)簽類型劃分及特性、inline、inline-block、block…
4、浮動進(jìn)階
浮動的作用、浮動的特性、文檔流、浮動的各種問題、clear、BFC(塊級格式化上下文)、觸發(fā)BFC的條件、Haslayout、Haslayout的觸發(fā)條件…
5、定位
relative相對定位、Absolute絕對定位、Absolute絕對定位、Fixed 固定定位、inherit 繼承、static靜態(tài)定位、默認(rèn)值、zIndex層級問題、margin負(fù)值、透明度…
6、表格和表單
表格標(biāo)簽、表格樣式重置、單元格合并、表單元素、表單相關(guān)的屬性操作、表單默認(rèn)樣式初始…
7、兼容性問題處理
兼容性問題總結(jié)、浮動在IE6，7下的各種問題、表單在低版本IE的問題、處理低版本IE對新增標(biāo)簽的支持、CssHack、條件注釋語句、PNG問題、透明度的問題、固定定位在IE低版本的處理方式…
8、整站進(jìn)階
樣式規(guī)劃、favicon、Css Sprite、Data URI、隱藏元素、測試工具使用、滑動門、等高布局、三列布局、未知寬高圖片在容器內(nèi)水平垂直居中、文本水平垂直居中、多行文本水平垂直居中…
9、css3入門
transition、屬性選擇器、nth-of-type、nth-child、backgroundSize、box-sizing、圓角，盒模型陰影、文字陰影、rgba、表單高級、H5表單新增屬性、E:not(s)、E:target、E::selection、
10、移動端布局
測試環(huán)境Emulation、viewport、window.devicePixelRatio、物理分辨率、Media Queries、rem、window.screen、移動端布局相關(guān)問題、window.deviceorientationevent、橫豎屏判斷…
11、Animation和Transform
瀏覽器前綴、keyFrames、Animation調(diào)用、播放次數(shù)設(shè)置、動畫偶數(shù)次調(diào)用順序、Animation的問題、無縫滾動、動畫播放|暫停、rotate旋轉(zhuǎn)、deg、skew斜切、scale縮放、translate位移、transform-origin、transform的執(zhí)行順序問題…
12、Bootstrap前端開發(fā)框架
Html語法規(guī)范、CSS語法規(guī)范、Less 和 Sass 中的嵌套、class 命名、選擇器、Normalize.css、柵格系統(tǒng)、排版、代碼、響應(yīng)式工具…
另外關(guān)于零基礎(chǔ)如何快速入門前端的問題，項(xiàng)目實(shí)戰(zhàn)這一點(diǎn)很重要，一定要學(xué)以致用，我的建議是，只有在實(shí)戰(zhàn)項(xiàng)目中多加練習(xí)才能真正的掌握這門技術(shù)！
轉(zhuǎn)自：csdn； 作者：hugo233
藍(lán)藍(lán)設(shè)計(jì)( www.lzhte.cn )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)
藍(lán)藍(lán)設(shè)計(jì)的小編 http://www.lzhte.cn