web前端開發(fā)看什么書

HTML、CSS方面比較經(jīng)典的書是《CSS禪意花園》，但是這本書出版比較早了（有點老）。當(dāng)前比較推薦的是2021年6月新出版的一本叫做《HTML5布局之路》的書，書籍從PC端和移動端分別講解了布局的整體思路和方法，和其它書不太一樣的地方在于，它采用的是非字典式的講述模式，是按照實戰(zhàn)開發(fā)的流程進行知識的拆分和講解。500多頁，除了基本技術(shù)還有面試真題、開發(fā)經(jīng)驗的分享。
HTML和CSS學(xué)完之后可以入手，比較經(jīng)典書籍是犀牛書（封面是一只犀牛，百度搜“JS 犀牛”能收到），還有一本是《高級程序設(shè)計》（行業(yè)里叫紅皮書），兩本書都比較經(jīng)典，涵蓋面比較廣，學(xué)起來會比較難一些。JS入門書還可以選擇 HeadFirst系列。個人感覺HeadFirst系列會比較容易讀懂，很多抽象概念都比較好的解釋了出來，我學(xué)習(xí)Ajax方面時就用的是這個系列入的門。

Web前端開發(fā)初級需要學(xué)習(xí)哪些知識些

Web前端不僅薪資比較高，而且發(fā)展前景也很可觀，越來越多的年輕人紛紛選擇web前端作為未來的職業(yè)發(fā)展方向，但是就怎么選擇學(xué)習(xí)方法而言，但是很多都是零基礎(chǔ)來學(xué)習(xí)web前端的，對于這個行業(yè)可能一概不知，該怎么去學(xué)習(xí)呢？什么樣的學(xué)習(xí)方法更適合學(xué)。，那么這份最詳細(xì)的web前端學(xué)習(xí)路線分享給大家。
*階段：前端頁面重構(gòu)
內(nèi)容包含了：（PC端網(wǎng)站布局項目、HTML+CSS基礎(chǔ)項目、WebApp頁面布局項目）
第二階段：高級程序設(shè)計
內(nèi)容包含：）原生 交互功能開發(fā)項目、面向?qū)ο筮M階與 ES/ES應(yīng)用項目、工具庫自主研發(fā)項目）
第三階段：PC端全棧項目開發(fā)
內(nèi)容包含：（jQuery經(jīng)典交互特效開發(fā)、HTTP協(xié)議、Ajax進階與PHP/JAVA開發(fā)項目、前端工程化與模塊化應(yīng)用項目、PC端網(wǎng)站開發(fā)項目、PC端管理信息系統(tǒng)前端開發(fā)項目）
第四階段：移動端項目開發(fā)
內(nèi)容包含：（Touch端項目、微信場景項目、應(yīng)用 Angular+Ionic開發(fā) WebApp項目、應(yīng)用 Vue.js開發(fā) WebApp項目、應(yīng)用 React.js開發(fā) WebApp項目）
第五階段：混合（Hybrid,）開發(fā)
內(nèi)容包含：（微信小程序開發(fā)、React Native、各類混合應(yīng)用開發(fā)）
第六階段：NodeJS全棧開發(fā)
內(nèi)容包括：（WebApp后端系統(tǒng)開發(fā)、一、NodeJS基礎(chǔ)與NodeJS核心模塊二、Express三、noSQL數(shù)據(jù)庫）
第七階段：大數(shù)據(jù)可視化
內(nèi)容包含：（大數(shù)據(jù)可視化化基礎(chǔ)與實戰(zhàn)、一、數(shù)據(jù)可視化入門、二、D.js詳解、三、其他JS庫）
對于想學(xué)習(xí)web前端的同學(xué)來說：首先是自學(xué)，其實自學(xué)也不是不可以，只要有毅力能堅持，自己學(xué)習(xí)是完全沒有問題的，現(xiàn)在有很多同學(xué)也是自己找資料視頻來學(xué)習(xí)。*技術(shù)也學(xué)的挺牛的，得看個人興趣和悟性，軟件開發(fā)本來就是一項比較枯燥的工作，如果只是單純的覺得這項行業(yè)工資高而進來的話，可能學(xué)習(xí)中遇到技術(shù)難題，就會知難而退了，難以堅持下去，而真正愛這行的會迎難而上，不解決不罷休，這也是為什么有些能自學(xué)下來有些卻不行的原因。
如果選擇培訓(xùn)機構(gòu)的話，對于沒有基礎(chǔ)或者毅力堅持下去的同學(xué)是比較好的學(xué)習(xí)方式，首先培訓(xùn)機構(gòu)課程比較完善，沒有基礎(chǔ)的同學(xué)往往不知道從哪個方向去學(xué)習(xí)，而培訓(xùn)機構(gòu)能更好的滿足這部分學(xué)員，一般培訓(xùn)機構(gòu)的老師都是經(jīng)驗比較豐富的，講課的時候重點和難點會詳細(xì)講解，及時解決，這樣學(xué)習(xí)的能保障每個學(xué)員都能弄懂，而且不用自己苦思冥想找答案。這樣也大大的提升了學(xué)習(xí)的熱情。最重要的是培訓(xùn)機構(gòu)有階段性的項目練習(xí)，這個對于自學(xué)的同學(xué)來說是沒有的，現(xiàn)在的企業(yè)都是看著每個求職者的動手能力，如果有項目的實踐操作，在應(yīng)聘中也更有競爭力。
其實不管自學(xué)還是培訓(xùn)機構(gòu)也好，最重要的是看自己的熱情，還有能不能吃苦和努力，web前端開發(fā)確實是高薪職業(yè)，市場需求也很大，只要你有本事，你就是企業(yè)需求的人才，那么想快速達到這個技術(shù)能力，自己該怎么做怎么學(xué)就看你自己的選擇了。

初學(xué)前端有什么推薦的書籍

一、《Web前端開發(fā)*實踐》

這本書是前端開發(fā)領(lǐng)域的經(jīng)典之作，是一本扎實前端基本功，規(guī)范我們前端代碼的實踐性書籍。本書主要講解了HTML、CSS、以及移動端開發(fā)的*實踐方案，能夠?qū)θ狈α己弥笇?dǎo)的開發(fā)者產(chǎn)生很大的幫助。通過閱讀本書我們可以掌握如何編寫高可讀性、高維護性、高性能的HTML、CSS以及。

二、《CSS那些事兒》

內(nèi)容介紹：《CSS那些事兒》是2009年電子工業(yè)出版社出版的圖書，作者是林小志。該書通過對CSS技巧實例進行講解，淺入深地分析了CSS相關(guān)知識。

通過頁面中的文字、圖片、表格、表單等常見元素的處理及各種頁面布局方式的使用，使讀者能深入了解到如何在頁面中更好地運用CSS布局。尤其是在頁面布局的部分中，全面分析了多種布局方式，著重分解了兩列等高和三列等高的幾種方式，并相應(yīng)說明了等高布局的優(yōu)缺點。

三、《CSS權(quán)威指南》

內(nèi)容介紹：《CSS權(quán)威指南》通過諸多示例，詳細(xì)講解了如何做到僅在一處建立樣式表就能創(chuàng)建或修改整個網(wǎng)站的外觀，以及如何得到html力不能及的更豐富的表現(xiàn)效果。同時展示了如何遵循css*規(guī)范（css2和css2.1）將層疊樣式表的方方面面應(yīng)用于實踐。

四、《 標(biāo)準(zhǔn)參考教程》阮一峰

內(nèi)容介紹：阮一峰 本書全面介紹 核心語法，從最簡單的開始講起，循序漸進、由淺入深，力求清晰易懂。所有章節(jié)都帶有大量的代碼實例，便于理解和模仿，可以用到實際項目中，即學(xué)即用。 本書適合初學(xué)者當(dāng)作語言的入門教程，也適合當(dāng)作日常使用的參考手冊。

五、高級程序設(shè)計第三版

內(nèi)容介紹：《全書從 語言實現(xiàn)的各個組成部分——語言核心、DOM、BOM、事件模型講起，深入淺出地探討了面向?qū)ο缶幊?、Ajax 與Comet 服務(wù)器端通信，HTML5 表單、媒體、Canvas（包括WebGL）及Web Workers、地理定位、跨文檔傳遞消息、客戶端存儲（包括IndexedDB）等新API，還介紹了離線應(yīng)用和與維護、性能、部署相關(guān)的*開發(fā)實踐。

六、鋒利的jquery

內(nèi)容介紹：《鋒利的jQuery(第2版)》循序漸進地對jQuery的各種函數(shù)和方法調(diào)用進行了介紹，讀者可以系統(tǒng)地掌握jQuery的選擇器、DOM操作、事件和動畫、AJAX應(yīng)用、插件、jQuery Mobile、jQuery各個版本變化、jQuery性能優(yōu)化和技巧等知識點，并結(jié)合每個章節(jié)后面的案例演示進行練習(xí)，達到掌握核心知識點的目的。

七、HTTP權(quán)威指南

內(nèi)容介紹：《HTTP權(quán)威指南》由古爾利所著，《HTTP權(quán)威指南》詳細(xì)解釋了如何用HTTP來開發(fā)基于Web的應(yīng)用程序，核心的[因特網(wǎng)協(xié)議，如何與架構(gòu)構(gòu)建塊交互，如何正確實現(xiàn)因特網(wǎng)客戶和服務(wù)器等。

《HTTP權(quán)威指南》的中心內(nèi)容是HTTP，本質(zhì)是理解Web的工作原理，以及如何將這些知識應(yīng)用到Web編程和管理之中，主要涵蓋HTTP的技術(shù)運作方式、產(chǎn)生動機、性能和目標(biāo)以及一些相關(guān)技術(shù)問題。 《HTTP權(quán)威指南》適合所有想了解HTTP和Web底層結(jié)構(gòu)的人閱讀。

八、高性能網(wǎng)站建設(shè)指南

內(nèi)容介紹：《高性能網(wǎng)站建設(shè)指南》結(jié)合Web2.0以來Web開發(fā)領(lǐng)域的*形勢和特點，介紹了網(wǎng)站性能問題的現(xiàn)狀、產(chǎn)生的原因，以及改善或解決性能問題的原則、技術(shù)技巧和*實踐。重點關(guān)注網(wǎng)頁的行為特征，闡釋優(yōu)化Ajax、CSS、、Flash和圖片處理等要素的技術(shù)，全面涵蓋瀏覽器端性能問題的方方面面。

如何學(xué)習(xí)WEB前端開發(fā)

先看視頻入門，然后看相關(guān)書籍在鞏固知識。打印一份HTML CSS 的參考手冊，這個要經(jīng)?？?，都知道這是最基礎(chǔ)的，掌握之后在去學(xué)一下jQuery，也不能說算學(xué)，花2個小時看一遍教程估計就懂50%了，剩下的寫幾個項目再熟悉熟悉。然后學(xué)和相關(guān)的技術(shù) 如canvas,這個就有點考驗數(shù)據(jù)結(jié)構(gòu)和算法了，有點熟悉之后再學(xué)一下數(shù)據(jù)結(jié)構(gòu)的知識。學(xué)會了這些在繼續(xù)進階，然后考慮瀏覽器兼容問題等等，然后再學(xué)習(xí)一些CSS預(yù)處理器的知識如LESS SASS等（掌握一個就好了），然后還有一些比較重要的js框架，requireJS AngularJS等。。?，F(xiàn)在覺得其中最難的還是CSS
作者：Kylin Chang

【網(wǎng)絡(luò)學(xué)習(xí)中心】如何用 CSS 隱藏超出顯示寬度的內(nèi)容 -html

提供兩個方案給你： 1、在頁面的腳本語言里面用類似于left的函數(shù)； 2、找個js或jq代碼來實現(xiàn)，css是需要很大的耐心去調(diào)整謙容性的，而且有一些bug是解決不了的； overflow:hidden;強制居中 width:200px; white-space:nowrap;強制在同一行內(nèi)顯示所有文本，直到文本結(jié)束或者遭遇br對象 text-overflow:ellipsis;這才是超出后用省略代替 下面給個例子給你

• clip: 直接將溢出的文字裁剪

  測試用文字測試用文字測試用文字測試用文字測試用文字測試用文字

• ellipsis: 將溢出的文字顯示省略標(biāo)記（...）

  測試用文字測試用文字測試用文字測試用文字測試用文字測試用文字

CSS 透明度怎么設(shè)置。 filter:alpha(opacity=10); 我這句話在IE中有效 在其它的瀏覽器中就沒效（Opera）

css中
filter僅支持ie6以及以上版本，
其余瀏覽器，包括firefox，chrome，opera，Safari都不支持。
要在這些版本設(shè)置透明度，可用opacity屬性，
支持的瀏覽器包括IE 9.0，F(xiàn)irefox，Safari，Chrome，opera。
opacity取值在0到1之間浮動
以下是示例代碼

下例是一個半透明的效果：

北京web前端培訓(xùn)機構(gòu)，出來好找工作嗎，需要學(xué)哪些內(nèi)容？

大部分人學(xué)習(xí)一項技術(shù)肯定是以就業(yè)為目標(biāo)，那么學(xué)習(xí)web前端哪些知識才能找到一份工作？小蝸這里根據(jù)行業(yè)的變化以及企業(yè)的用人需求，整理了一份web前端的學(xué)習(xí)路線，只要掌握了以下內(nèi)容，找到一份工作基本不難。

*階段：專業(yè)核心基礎(chǔ)

階段目標(biāo)：

1. 熟練掌握HTML5、CSS3、Less、Sass、響應(yīng)書布局、移動端開發(fā)。

2. 熟練運用HTML+CSS特性完成頁面布局。

4. 熟練應(yīng)用CSS3技術(shù)，動畫、彈性盒模型設(shè)計。

5. 熟練完成移動端頁面的設(shè)計。

6. 熟練運用所學(xué)知識仿制任意Web網(wǎng)站。

7. 能綜合運用所學(xué)知識完成網(wǎng)頁設(shè)計實戰(zhàn)。

知識點：

1、Web前端開發(fā)環(huán)境，HTML常用標(biāo)簽，表單元素，Table布局，CSS樣式表，DIV+CSS布局。熟練運用HTML和CSS樣式屬性完成頁面的布局和美化，能夠仿制任意網(wǎng)站的前端頁面實現(xiàn)。

2、CSS3選擇器、偽類、過渡、變換、動畫、字體圖標(biāo)、彈性盒模型、響應(yīng)式布局、移動端。熟練運用CSS3來開發(fā)網(wǎng)頁、熟練開發(fā)移動端，整理網(wǎng)頁開發(fā)技巧。

3、預(yù)編譯css技術(shù)：less、sass基礎(chǔ)知識、以及插件的運用、BootStrap源碼分析。能夠熟練使用 less、sass完成項目開發(fā)，深入了解BootStrap。

4、使用HTML、CSS、LESS、SASS等技術(shù)完成網(wǎng)頁項目實戰(zhàn)。通過項目掌握*階段html、css的內(nèi)容、完成PC端頁面設(shè)計和移動端頁面設(shè)計。

第二階段：Web后臺技術(shù)

階段目標(biāo):

1. 了解的發(fā)展歷史、掌握Node環(huán)境搭建及npm使用。

2. 熟練掌握的基本數(shù)據(jù)類型和變量的概念。

3. 熟練掌握中的運算符使用。

4. 深入理解分之結(jié)構(gòu)語句和循環(huán)語句。

5. 熟練使用數(shù)組來完成各種練習(xí)。

6.熟悉es6的語法、熟練掌握面向?qū)ο缶幊獭?/p>

7.DOM和BOM實戰(zhàn)練習(xí)和H5新特性和協(xié)議的學(xué)習(xí)。

知識點：

1、軟件開發(fā)流程、算法、變量、數(shù)據(jù)類型、分之語句、循環(huán)語句、數(shù)組和函數(shù)。熟練運用的知識完成各種練習(xí)。

2、面向?qū)ο蠡A(chǔ)、異常處理機制、常見對象api，js的兼容性、ES6新特性。熟練掌握面向?qū)ο蟮拈_發(fā)以及掌握es6中的重要內(nèi)容。

3、BOM操作和DOM操作。熟練使用BOM的各種對象、熟練操作DOM的對象。

4、h5相關(guān)api、canvas、ajax、數(shù)據(jù)模擬、touch事件、mockjs。熟練使用所學(xué)知識來完成網(wǎng)站項目開發(fā)。

第三階段：數(shù)據(jù)庫和框架實戰(zhàn)

階段目標(biāo)：

1. 綜合運用Web前端技術(shù)進行頁面布局與美化。

2. 綜合運用Web前端開發(fā)框架進行Web系統(tǒng)開發(fā)。

3. 熟練掌握Mysql、Mongodb數(shù)據(jù)庫的發(fā)開。

4. 熟練掌握vue.js、webpack、elementui等前端框技術(shù)。

5. 熟練運用Node.js開發(fā)后臺應(yīng)用程序。

6. 對Restful，Ajax，JSON，開發(fā)過程有深入的理解,掌握git的基本技能。

知識點：

1、數(shù)據(jù)庫知識，范式，MySQL配置，命令，建庫建表，數(shù)據(jù)的增刪改查，mongodb數(shù)據(jù)庫。深入理解數(shù)據(jù)庫管理系統(tǒng)通用知識及MySQL數(shù)據(jù)庫的使用與管理，為Node.js后臺開發(fā)打下堅實基礎(chǔ)。

2、模塊系統(tǒng)，函數(shù)，路由，全局對象，文件系統(tǒng)，請求處理，Web模塊，Express框架，MySQL數(shù)據(jù)庫處理，，文件上傳等。熟練運用Node.js運行環(huán)境和后臺開發(fā)框架完成Web系統(tǒng)的后臺開發(fā)。

3、vue的組件、生命周期、路由、組件、前端工程化、webpack、elementui框架。Vue.js框架的基本使用有清晰的理解，能夠運用Vue.js完成基礎(chǔ)前端開發(fā)、熟練運用Vue.js框架的高級功能完成Web前端開發(fā)和組件開發(fā)，對MVVM模式有深刻理解。

4、需求分析，數(shù)據(jù)庫設(shè)計，后臺開發(fā)，使用vue、node完成pc和移動端整站開發(fā)。于Node.js+Vue.js+Webpack+Mysql+Mongodb+Git，實現(xiàn)整站項目完整功能并上線發(fā)布。

第四階段：移動端和微信實戰(zhàn)

階段目標(biāo)：

1.熟練掌握React.js框架，熟練使用React.js完成開發(fā)。

2.掌握移動端開發(fā)原理，理解原生開發(fā)和混合開發(fā)。

3.熟練使用react-native和Flutter框架完成移動端開發(fā)。

4.掌握微信小程序以及了解支付寶小程序的開發(fā)。

5.完成大型電商項目開發(fā)。

知識點：

1、React面向組件編程、表單數(shù)據(jù)、組件通信、監(jiān)聽、聲明周期、路由、Redux基本概念。練使用react完成項目開發(fā)、掌握Redux中的異步解決方案Saga。

2、react-native、開發(fā)工具、視圖與渲染、api操作、Flutter環(huán)境搭建、路由、ListView組件、網(wǎng)絡(luò)請求、打包。練掌握react-native和Flutter框架，并分別使用react-native和Flutter分別能開發(fā)移動端項目。

3、微信小程序基本介紹、開發(fā)工具、視圖與渲染、api操作、支付寶小程序的入門和api學(xué)習(xí)。掌握微信小程序開發(fā)了解支付寶小程序。

4、大型購物網(wǎng)站實戰(zhàn)，整個項目前后端分離開發(fā)；整個項目分為四部分：PC端網(wǎng)頁、移動端APP、小程序、后臺管理。團隊協(xié)作開發(fā)，使用git進行版本控制。目期間可以擴展Three.js 、。

web前端學(xué)習(xí)路線思維導(dǎo)圖

Web前端工程師初級階段需要掌握的內(nèi)容

今天小編給大家整理出來了Web前端工程師初級階段需要掌握的內(nèi)容，很全面，希望大家好好閱讀，看看自己掌握的知識點和文章里面寫的還相差多少。下面來和小編一起看一看吧！





一、什么是初級Web前端工程師?


按照我的想法，我把前端工程師分為了入門、初級、中級、高級這四個級別，


入門級別指的是了解什么是前端(前端到底是什么其實很多人還是不清楚的)，了解基本的html、css和語法(這些語方面的東西網(wǎng)上隨便搜一下就有很多很多，基本的語法是整個技術(shù)體系最重要的東西了，領(lǐng)先的
Web技術(shù)教程)，可以根據(jù)設(shè)計師的設(shè)計圖在不考慮兼容性的情況下把頁面做出來，了解過一些框架的使用(例如爛大街但是依然牛逼的jQuery、zepto、
bootstrap等等)。


在經(jīng)歷過入門的階段，已經(jīng)了解了前端要做什么，并且把基本的語法學(xué)習(xí)過了可以獨立做一些簡單的頁面了，那么就要繼續(xù)學(xué)習(xí)達到初級前端工程師的水平，對于初級的前端工程師需要了解的就特別多了，需要對整個前端有一個清晰的認(rèn)識，并且熟練使用各種技術(shù)，我感覺在校的學(xué)生達到初級水平就可以通過bat的校招筆試
面試了。


初級前端工程師：首先要知道的就是如何處理各種瀏覽器的兼容處理(比如說在IE瀏覽器中的有什么不同等等內(nèi)容)，現(xiàn)在基本上每個公司在招聘的時候都會要求熟練html5,
css3,，這個熟練的意思就是信手拈來。


在下面會說初級前端工程師應(yīng)該具體的學(xué)習(xí)哪些知識，然后就是要了解各種css的預(yù)處理器和后處理器，還有會使用常見前端的MV*框架(angularjs,
backbone，reactjs等等)并知道這些框架的原理，另外就是要熟練使用nodejs，要會使用基于node的各種前端構(gòu)建工具
(grunt，gulp等等)，熟練使用github或gitlab，對模塊化、組件化、工程化、語義化有一個比較深入的了解，*要知道如何開發(fā)移動端
的頁面，如何去優(yōu)化一個頁面的性能。


二、初級Web前端工程師的技術(shù)體系


(一)HTML部分


首先是要掌握一些常用標(biāo)簽的使用和他們的各個屬性，這些常用的標(biāo)簽我總結(jié)了一下有以下這些：


html：頁面的根元素。head：頁面的頭部標(biāo)簽，是所有頭部元素的容器。body：頁面的主體標(biāo)簽，頁面展現(xiàn)的內(nèi)容就放置在這里面。title：頁面的標(biāo)題。meta：位于文檔的頭部，提供頁面的元信息，包括關(guān)鍵字、描述等等。link：定義文檔與外部資源的關(guān)系，最常用的用途就是引入樣式表。script：腳本標(biāo)簽，可以把js腳本代碼放置在這個標(biāo)簽內(nèi)，也可以使用這個標(biāo)簽的src屬性引入一個外部標(biāo)簽。style：樣式標(biāo)簽，可以把css代碼寫在這個標(biāo)簽中。a：超鏈接，href屬性代表要鏈接到的地方，target屬性代表打開方式。img：圖像標(biāo)簽，src屬性表示圖片的位置。form：表單元素，它內(nèi)部的input、select、textarea等標(biāo)簽都是比較重要的。div：定義文檔中的分區(qū)或節(jié)，可以使用div來進行頁面的布局等操作。另外還有ul、li、p、button、iframe、p、table等標(biāo)簽也很常用，nav、section、article、header、aside、footer等語義化標(biāo)簽也需要了解一下。


除了要了解上面這一些標(biāo)簽之外，還需要對一些新的HTML5的API有一定的了解：


·audio、video標(biāo)簽。


·Canvas：定義圖形，比如圖表和其他圖像。


·input標(biāo)簽的accept屬性，email、phone、url等類型。


·根據(jù)class名來獲取一個元素結(jié)點。


·多文件選擇屬性。


·html的import、template


·process標(biāo)簽，WebGL等內(nèi)容。


還有一些要知道的知識點：


1.
doctype的作用。2.unicode、utf8等編碼的原理和區(qū)別。3.如何進行頁面性能優(yōu)化。4.png、jpg、Webp、gif等圖片格式的不同的優(yōu)勢。5.HTML行內(nèi)元素與塊級元素的區(qū)別。6.移動Web端開發(fā)常用head標(biāo)簽。7.Web語義化。8.瀏覽器中的緩存原理


(二)CSS部分


關(guān)于css這一塊，我的看法就是網(wǎng)上下載一個chm格式的css的參考手冊，然后根據(jù)手冊里面寫的一個個的都敲一下。


css大體分為下面這幾塊知識點：


①定位布局


1.position屬性的7個值(static|relative|absolute|fixed|center|page|
sticky)分別有什么作用和不同?


2.實現(xiàn)品字形布局或者是三欄布局(左右寬度固定，中間適應(yīng)屏幕)。


3.浮動與清除浮動的方法，flex布局，grid布局。


②盒子模型


1.margin、padding、border這三個屬性。


2.伸縮盒相關(guān)內(nèi)容。


3.Multi-多列布局模型。


③文本字體


1.強制換行與不換行，清除空白。


2.文本對齊、大小(如何設(shè)置chrome小于12px的字體)、縮進、轉(zhuǎn)換。


3.單位(em、rem、px等)，顏色(rgb、rgba，hls)。


④變換、過渡和動畫


1.transform的各種取值的作用與兼容性。


2.過渡的動畫類型，貝塞爾曲線的原理。


3.animation動畫的各種設(shè)置，@keyframes規(guī)則。


4.瀏覽器的重繪與重排。


⑤選擇器


1.選擇器的分類，權(quán)值和優(yōu)先級。


2.有哪些屬性可以被繼承，哪些屬性沒法繼承。


3.偽類和偽元素分別是什么，有什么作用。


上面這些都是基礎(chǔ)的東西，除了這些基礎(chǔ)的內(nèi)容之外需要了解Less、Sass、stylus等css預(yù)處理器，這將會大幅度提升你的css開發(fā)效率，也需要了解一下、PostCSS等css后處理器。


(三)部分


在這里就不說js的基礎(chǔ)知識了，我把js按照語法的層次和使用的層次分為了兩大塊。


按照語法的層次來說：


首先是的面向?qū)ο蠓矫娴膬?nèi)容：在中實現(xiàn)封裝、繼承和多態(tài)。


①封裝：在js中可以通過閉包、作用域和作用域鏈來實現(xiàn)封裝，ES6的const、let的作用。②
繼承：基于原型鏈的繼承、基于構(gòu)造函數(shù)的繼承、組合式繼承、寄生式繼承等，外加ES6的class關(guān)鍵字，prototype和__proto__。③
多態(tài)：在中多態(tài)是使用arguments來實現(xiàn)的，關(guān)于arguments會引申出來很多內(nèi)容：1.arguments的caller、callee等方法的作用。2.方法的apply和call的作用和不同。3.使用Array.prototype.slice.call來把一個數(shù)組對象轉(zhuǎn)化為數(shù)組。4.array的各種方法，如shift、splice、push、filter、map、reduce、forEach等等。


然后是Js的設(shè)計模式，比如說那三種工廠模式啊，建造者模式啊等等。


*是在不同情況下的this分別都代表什么。


按照使用的層次來說：


首先最主要的就是ajax，ajax的原理，ajax跨域的方法：jsonp、使用iframe的location.hash、、Websocket、服務(wù)器代理等等。


然后是tcp協(xié)議、udt協(xié)議以及http協(xié)議的協(xié)議頭、狀態(tài)碼等內(nèi)容。瀏覽器的緩存，客戶端存儲方面的內(nèi)容：、、indexDB、cookie等等。


*是一些新的js的API，例如文件讀取()、fetch、Promise、Web
Sockets等等內(nèi)容，可以去caniuse上面看一下有哪些新的東西。


上面我所說的這些只是一些比較籠統(tǒng)的概念，把前端html、css和所需要掌握的部分內(nèi)容列舉了一下，在前端領(lǐng)域還有很多需要我們知道的知識，這需要大家在學(xué)習(xí)工作的過程中去自己總結(jié)。


以上就是小編今天為大家分享的關(guān)于Web前端工程師初級階段需要掌握的內(nèi)容的文章，希望本篇文章能夠?qū)φ趶氖耊eb前端工作的小伙伴們有所幫助，想要了解更多Web前端相關(guān)知識記得關(guān)注北大青鳥Web培訓(xùn)官網(wǎng)。*祝愿小伙伴們工作順利！

前端必看的書籍

了解更多的前段知識請看下面我精心為您整理的前端必看的書籍，希望您喜歡!

十本學(xué)習(xí)前端必看書籍

*本，入門

《Head first HTML&CSS》

*的入門書?？磧杀榫蛯TML & CSS 有個大概印象了。

此時把w3cschool作為備查手冊收藏起來

第二本《CSS權(quán)威指南(第三版)》

最權(quán)威的CSS書籍，除了閱讀W3C的文檔外的不二選擇(就是翻譯有點操蛋，遇到感到難理解的地方可能還是要求助于網(wǎng)絡(luò)資源)。有時間(無論是現(xiàn)在還是將來)可以反復(fù)看，并當(dāng)做字典隨時查。

第三本《精通CSS》

廣受前輩推薦的一本書。上一本書是字典的話，這本書相當(dāng)于《中學(xué)生作文大全》，匯集了一些CSS的*實踐。

第四本《圖解CSS3：核心技術(shù)與案例實踐》

這本書比較新，講解的是*的CSS3(前三本書停留在CSS2.1時代)，CSS3也是必學(xué)的，不是什么可學(xué)可不學(xué)的*技術(shù)。

HTML CSS值得看的書就這些(之后會有一本《CSS秘密花園》，尚在翻譯中，也很值得期待)，剩下的就是自己寫還有看技術(shù)博客了。接下來是，HTML和CSS都是沒有邏輯的標(biāo)記型語言，JS才是真正的編程語言，評價前端工程師的水平就看這個了。

第五本《 DOM編程藝術(shù)》

*的JS入門書籍，一目了然地告訴你如何用JS操作DOM(這是瀏覽器端編程的基本功)，還灌輸了*標(biāo)準(zhǔn)的編程理念?？上в悬c老，*一版是2010年的，以至于部分內(nèi)容有點過期，例如本書內(nèi)經(jīng)常提到“某某方法瀏覽器不一定支持，需要小心使用”，而這些歷史遺留問題當(dāng)今已經(jīng)不存在了，閱讀過程中無視就好。

第六本《高級程序設(shè)計》

每個前端必看的書，此書是前端工程師科技樹的關(guān)鍵一環(huán)。看完此書后再看看之后各類進階書籍會比較好。

俗稱紅寶書，也算入門書籍，雖然是大部頭(七百多頁)，但至少通讀一遍。

全部掌握了，你可以在網(wǎng)絡(luò)社區(qū)里談笑風(fēng)生了，經(jīng)過實踐的鍛煉后，面試個前端工程師的崗位應(yīng)該都沒問題了。

第七本《語言精粹》

也是前端必看。薄薄一百來頁，對JS的去粗取精。

第八本《你不知道的》

這是一套叢書， 目前為止僅翻譯了*卷。每本都挺薄，深入介紹了JS中的重要概念。

第九本《設(shè)計模式》

“設(shè)計模式”是軟件工程的重要課題，相當(dāng)于高考時候的答題套路。前人總結(jié)出來的應(yīng)對各種問題的模板。也算是必看書籍。關(guān)于設(shè)計模式的書籍目前也有好幾本，也有國人寫的，挑一兩本看看就好。

第十本《高性能網(wǎng)站建設(shè)指南》(及其續(xù)篇《高性能網(wǎng)站進階》)

告訴你真正的商業(yè)公司的前端是怎么優(yōu)化一個網(wǎng)站的。當(dāng)然優(yōu)化的問題不是看看書就能解決的，*時刻了解你的同行們的經(jīng)驗。

*階段：HTML和CSS的學(xué)習(xí)

HTML就不多說了，基礎(chǔ)中的基礎(chǔ)，這個都不會的小伙伴請參見HTML手冊，認(rèn)真學(xué)習(xí)W3C課程，稍有基礎(chǔ)之后可以跟著視頻學(xué)習(xí)《HTML+CSS基礎(chǔ)課程》。

　 　前端開發(fā)必看的14本書

1、《CSS權(quán)威指南》第三版

這本書實在太適合小白用戶了，是一本為初學(xué)者清掃障礙的書籍。同行一致認(rèn)為這本書是學(xué)習(xí)CSS基礎(chǔ)的*。CSS界權(quán)威Meyer大師的作品，翻譯水平也灰常贊!

2、《CSS那些事兒》

不用于一般技術(shù)類書籍的枯燥乏味，這本書很有意思。作者是藍色理想經(jīng)典論壇標(biāo)準(zhǔn)版榮譽版主林小志，具有多年網(wǎng)站設(shè)計和網(wǎng)站重構(gòu)經(jīng)驗，在CSS、XHTML等前臺技術(shù)方面有著深厚功底。

全書以傳達CSS布局思維為中心，通過頁面中的文字、圖片、表格、表單等常見元素的處理及各種頁面布局方式的使用，使讀者能深入了解到如何在頁面中更好地運用CSS布局。閱讀本書之后將會發(fā)現(xiàn)，原來CSS樣式居然是這么好玩的東西。

3、《精通CSS：高級Web標(biāo)準(zhǔn)解決方案》第二版

前段學(xué)習(xí)必備書籍，作者Andy Budd是國際頂尖的網(wǎng)頁設(shè)計師，著名的Web標(biāo)準(zhǔn)倡導(dǎo)者，網(wǎng)頁咨詢公司Clearleft的創(chuàng)始人之一。

本書將最有用的CSS技術(shù)匯總在一起，總結(jié)了CSS設(shè)計中的*實踐，討論了解決各種實際問題的技術(shù)，重點講解了一系列的css開發(fā)技巧，是前端開發(fā)人員必備的手冊。

4、《CSS禪意花園》

這是一本令人驚嘆的書!必須用一個字形容的話，那就是：美!內(nèi)容編排合理,文字生動有趣引人入勝,通過一個個實例引導(dǎo)讀者閱讀，強烈推薦!

作者是世界著名的網(wǎng)站設(shè)計師，書中的范例來自網(wǎng)站設(shè)計領(lǐng)域最著名的網(wǎng)站——CSS Zen Garden(CSS禪意花園)。童鞋們自己去領(lǐng)略吧。

第二階段——的學(xué)習(xí)

的書籍當(dāng)然還是要看老外的，你懂得~

5、《編程藝術(shù)》

此書絕對是入門好書，簡潔優(yōu)美的文筆簡直是工具書中的典范啊有木有!

這本書講述了和DOM的基礎(chǔ)知識，但重點放在DOM編程技術(shù)背后的思路和原則，然后將這些概念貫穿在書中的所有代碼示例中，使你看到用來創(chuàng)建圖片庫頁面的腳本、用來創(chuàng)建動畫效果的腳本和用來豐富頁面元素呈現(xiàn)效果的腳本，*結(jié)合所講述的內(nèi)容創(chuàng)建了一個實際的網(wǎng)站。

6、《權(quán)威指南》第6版

這本書非常適合初級、中級程序員，是學(xué)習(xí)核心語言和由Web瀏覽器定義的 API的指南和綜合參考手冊。

第6版涵蓋HTML 5和 5。很多章節(jié)完全重寫，緊跟當(dāng)今*Web開發(fā)實踐。本書新增章節(jié)描述了jQuery和服務(wù)器端。

7、《高級程序設(shè)計》第三版

《權(quán)威指南》比較像一本字典，而這本《高級程序設(shè)計》可以算是一本由淺入深的好讀物。這兩本書看完后，對一定會有較為深入的了解。

作者Nicholas C. Zakas是世界頂級Web技術(shù)專家，現(xiàn)為雅虎公司界面呈現(xiàn)架構(gòu)師，負(fù)責(zé)My Yahoo!和雅虎首頁等大訪問量站點的設(shè)計。這本書，看一遍不能算看過，至少讀兩三遍，每一遍都會讓你有新的收獲。

8、《高性能》

本書從性能角度全面分析js，含金量非常大，很多知識都是作者通過實踐總結(jié)出來的，都是經(jīng)驗的積累，強烈推薦!

同是Nicholas C. Zakas所寫，如果看《JS高級程序設(shè)計》覺得理解不太透徹，學(xué)習(xí)較為吃力，那么我強烈建議你看看這本書，真的是極好的一本實踐類書籍，言簡意賅，灰常實用!

9、《王者歸來》

這本《王者歸來》不僅是一本傳播知識的書，更是一本求道的書。O(∩_∩)O 有追求的程序員一定不要錯過!愿神力與你同在!

它揭開了的面紗，繞過誤解和虛幻的表象，引領(lǐng)你探索程序王國的奧妙。這是一本探尋程序設(shè)計思想本源的“魔法典籍”，也是一本W(wǎng)eb開發(fā)工程師們需要的案頭參考書。

10、《模式》

它絕對不是一本入門級別的書，適用于希望將自身的技巧提高到一個新層次的專業(yè)的開發(fā)人員和程序員。

《模式》包含了實現(xiàn)每個討論的模式的實踐建議，并附有數(shù)個可以立即上手的范例;同時還可以學(xué)到一些反模式。短小精悍，進階必讀!

11、《設(shè)計模式》

進階教程，得有一定功底才能看懂。反之，如果你輕而易舉就能拿下此書，說明你已非等閑之輩~

本書共有兩部分。*部分給出了實現(xiàn)具體設(shè)計模式所需要的面向?qū)ο筇匦缘幕A(chǔ)知識，第二部分則專注于各種具體的設(shè)計模式及其在語言中的應(yīng)用，主要介紹了工廠模式、橋接模式、組合模式、門面模式等幾種常見的模式。

第三階段——jQUery的學(xué)習(xí)

12、《鋒利的jQuery》第二版

入門*，簡單易懂，非常實在。《鋒利的jQuery(第2版)》循序漸進地對jQuery的各種函數(shù)和方法調(diào)用進行了介紹，對jQuery分析的邏輯非常值得學(xué)習(xí)。

第四階段—學(xué)無止境!

如果以上書籍你全都搞定了，那么，恭喜你，你真的很厲害!到這種程度，相信你也不太需要別人推薦書籍了，不過我還是厚著臉皮推薦兩本吧。

13、《高性能網(wǎng)站建設(shè)指南》

前端開發(fā)可以優(yōu)化網(wǎng)站剩余70%~80%性能，這本書不算厚，幾個小時就能看完，推薦前端開發(fā)工程師看看。在《高性能網(wǎng)站建設(shè)指南》中，作者給出了14條具體的優(yōu)化原則，每一條原則都配以范例佐證，并提供了在線支持。

14、《Web開發(fā)敏捷之道》第二版

Web開發(fā)敏捷之道》曾榮獲Jolt大獎“*技術(shù)圖書”獎。在第1版的內(nèi)容架構(gòu)基礎(chǔ)上，第2版增加了對Rails 1.2中新特性和*實踐的介紹。此書覆蓋了rails1.2的方方面面，其本身也很"敏捷"，翻譯也非常好。