㈠ 可用於前端開發的框架或類庫有哪些
1. Bootstrap
Boostrap絕對是目前最流行用得最廣泛的一款框架。它是一套優美，直觀並且給力的web設計工具包，可以用來開發跨瀏覽器兼容並且美觀大氣的頁面。它提供了很多流行的樣式簡潔的UI組件，柵格系統以及一些常用的JavaScript插件。
Bootstrap是用動態語言LESS寫的，主要包括四部分的內容：
腳手架——全局樣式，響應式的12列柵格布局系統。記住Bootstrap在默認情況下並不包括響應式布局的功能。因此，如果你的設計需要實現響應式布局，那麼你需要手動開啟這項功能。
基礎CSS——包括基礎的HTML頁面要素，比如表格(table)，表單(form)，按鈕(button)，以及圖片(image)，基礎CSS為這些要素提供了優雅，一致的多種樣式。
組件——收集了大量可以重用的組件，如下拉菜單（dropdowns），按鈕組（button groups），導航面板（navigation control）——包括：tabs,pills,lists標簽，麵包屑導航（breadcrumbs）以及頁碼（pagination），縮略圖(thumbnails)，進度條（progress bars），媒體對象（media objects）等等。
JavaScript——包括一系列jQuery的插件，這些插件可以實現組件的動態頁面效果。插件主要包括模態窗口（modals），提示效果（tool tips），「泡芙」效果（popovers），滾動監控（scrollspy），旋轉木馬(carousel)，輸入提示(typeahead)，等等。
Bootstrap已經足夠強大，能夠實現各種形式的 Web 界面。為了更加方便地利用Bootstrap進行開發，很多工具和資源可以用來配合使用，下面列舉了其中的一部分工具和資源。
jQuery UI Bootstrap —— 對於jQuery和Bootstrap愛好者來說這是個非常好的資源，能夠把 Bootstrap的清爽界面組件引入到jQuery UI中。
jQuery Mobile Bootstrap Theme —— 和上面提到的jQuery UI主題類似，這是一個為jQuery Mobile建立的主題。如果你想讓用Bootstrap開發的網站在手機端也可以優雅訪問，那麼這個資源對你來說很方便易用。
Fuel UX —— 它為Bootstrap添加了一些輕量的JavaScript控制項。Fuel UI 安裝，修改，更新以及優化都很簡單方便。
StyleBootstrap.info —— Bootstrap提供了自己的幾種界面風格，StyleBootstrap提供了更多的配色選項，並且你可以給每個組件都應用不同的配色。
BootSwatchr —— 利用這個工具你可以立刻查看主題修改後的效果。對於每一次變動的效果，這個應用都會生成一個唯一的URL方便你與他人分享，你也可以在任意時刻修改你的主題。
Bootswatch —— 提供大量免費的Bootstrap主題。
Bootsnipp —— 在線前端框架交互組件製作工具，是一個供給設計師和開發者的基於Bootstrap HTML/CSS/JavaScript 架構的免費元素。
LayoutIt —— 通過界面拖放生成器簡便快捷地創建基於Bootstrap的前端代碼。通過拖放動作將Bootstrap風格的組件加入到你的個人設計里並且可以方便地修改他們的屬性，簡單便捷。
2. Fbootstrapp
Fbootstrapp基於Bootstrap並且提供了跟Facebook iframe apps和設計相同的功能。包含用於所有標准組件的基本的CSS和HTML，包括排版、表單、按鈕、表格、柵格、導航等等，風格與Facebook類似。
3. BootMetro
BootMetro框架的靈感來自於Metro UI CSS，基於Bootstrap 框架構建，用於創建Windows 8 的Metro風格的網站。它包括所有Bootstrap的功能，並添加了幾個額外的功能，比如頁面平鋪，應用程序欄等等。4. Kickstrap
Kickstrap是Bootstrap的一個變體。它基於Bootstrap，並在它的基礎上添加了許多app，主題以及附加功能。這使得這個框架可以單獨地用於構建網站，而不需要額外安裝什麼。你需要做的僅僅是把它放到你的網站上，然後用就可以了。
App 是一些頁面載入完成之後載入運行的JavaScript和CSS打包文件。默認載入的app有Knockout.js, Retina.js, Firebug Lite, and Updater，你也可以自行添加更多的app。
選擇不同的主題可以讓你的網站在眾多Bootstrap構建的類似網站中顯得與眾不同。
附加功能是一些用來擴展Bootstrap UI 庫的附件，它們的語法基本相同或者相似。
㈡ 從事Web前端工作要掌握哪些技術
今天要跟大家分享的文章是關於從事web前端工作要掌握哪些技術??相信小夥伴們對Web前端並不陌生，那麼想要從事web前端開發工作需要掌握哪些技術呢?下面就讓我們一起來看一看吧！
分析各大招聘網站對前端的招聘要求我們可以了解到，Web前端人員要掌握HTML、CSS、JavaScript、前端框架、工具類庫等，還要具備相應的實戰經驗。想要快速掌握這些技能，你可以選擇專業學習一下，一般要學習下面這些內容：
web前端開發中需要掌握的技術：
1、學習HTML，這是最簡單，最基本的是要掌握div，formtable、Ulli、P、跨度、字體這些標簽，這些都是最前端的學習都是需要不斷的學習，學一天停一停相當於白學。
2、學習CSS，CSS這里說的不包括CSS3Web前端開發工程師裡面我們看到的，一個可以使用HTML或CSS+
CSS+DIV的界面布局，所以CSS是用來協助HTML布局和顯示，我們稱之為「CSS樣式」，為什麼說DIV+CSS?因為我說div是HTML主要用於布局的，所以div是這個東西的核心!CSS必須配合部。CSS必須掌握浮、位置、寬度和高度，以及最大值和最小值，以100%，溢出，邊緣、填充等。這些都是與布局相關的樣式。
3、JS。你覺得還過的去，看看JS是可怕的，事實上，JS入門很簡單，不需要很多東西，只要根據ID或名稱DOM或」風格，或價值，然後以一個ID或名稱元標簽，或額外的數據，在HTML，這是對數據的操作有關系，那麼數據邏輯的影響，無非是一個跳躍，彈框，隱藏什麼，這一切都是結合其他應用，代碼一點都不難，將這些基本的JS。網路其他好。然後多看一些，不是什麼問題。
4、學習jQuery，相當於封裝一組JS插件的JS。其目的是操作更方便，編寫更少的代碼，jQuery條目也非常簡單。這些都是切入點，要學會像JS，只是改變了JQ代碼。剩下的就跟網路一樣。
5、最好是指出背景語言，如java，php，為什麼?因為我們是前台介面數據，從後台到點，如果後台代碼，你知道如何與後台數據交互是最好的，它節省了時間，也可以使前端代碼更加規范。否則，可能是因為你回來了，無法忍受的數據，然後前端代碼再次重寫，這將是可怕的。
6、研究CSS3+HTML5
以上6點，基本上是一個web前端開發工程師掌握的技術，我也試著講述一下自己的經驗，但是我們不認為上面的6點只是我說的那麼簡單，沒有，他們正在使用，這是在這樣的一個火中，因為堅強!我說的就是這么簡單，你覺得原因很難祛除，萬事開頭難，我說的是方法和技巧的入門，需要了解的東西。除了告訴你一個秘密，不要以為代碼很難敲，現在什麼語言都有自動提示代碼功能，只需要輸入一個字元，兩個字元，後面的代碼就會彈出，讓你選擇!你害怕什麼?所以不要害怕你糟糕的英語。
以上就是小編今天為大家分享的關於為從事web前端工作要掌握哪些技術的文章，希望本篇文章能夠對正在從事web前端工作的小夥伴們有所幫助，想要了解更多web前端相關知識記得關注北大青鳥web培訓官網，最後祝願小夥伴們工作順利，成為一名優秀的web前端工程師。
㈢ 網頁前端常用的庫或框架有哪些
bootstrap是twitter出的一款不錯的UI框架，或者與其說是框架不如說是類庫（lib），當然這里邊牽扯到一個「究竟什麼是框架什麼是類庫？」的問題，我們暫時不談。畢竟是有大公司背景的代碼堆，我覺得沒什麼「落伍」可言。
angular是前兩年之內突然火得一塌糊塗的一個fe框架，這個我覺得可以算的上是真正意義上的框架了，MVVM雙向綁定，包括它擁有足夠完善的社區、生態，甚至chrome上都有很多好用的相關插件（這一點可以說是佔了google出品的光），比較完整的大型項目都是可以考慮引入的。但如果你的網站只是做一些輕量級的東西，殺雞焉用宰牛刀吧我覺得。
backbone主要針對的MVC中的M層，至少我是這么理解的。對UI層它幾乎沒什麼太多的限制，一方面給出了coder自由度進行發揮，另一方面也等於在這方面框架本身對開發沒提供什麼太大的幫助。我覺得這更像是一個高手向的框架，另外對於underscore前端模板那一套東西，說實話作為一名php java啥都能寫的FE我始終覺得這套東西有那麼一種純JS工程師的一廂情願的意味。這是個人看法了，不一定準確，況且有人會搬出ajax動態渲染時 前端模板的作用來反駁我，別急著反駁，至少往下看完我說的話。
相比之下，react可以說是一個在MVC中V層做的十分出色和新穎的框架了，獨特的jsx編譯機制就已經讓你的代碼變得高大上了，我是覺得這個類庫在UI層做的更徹底更專業，或者說讓FE的代碼更專業了。更何況，react比angular更年輕，而且同樣擁有大公司背景，react native一出更是讓JS工程師的地位取得了革命性的提升，（不要跟我提phonegap，用過兩個東西後你會明白，react打包的app性能甩phonegap幾條街沒問題）。另外既然樓主提到了之前的網站是bootstrap，不妨可以看一看react-bootstrap這個東西，或許這就是你想要的。
㈣ web前端開發需要掌握哪些知識
1.學習html。
這是最簡單最基本的。掌握div、formtable、ulli、p、span、font等標簽是最常用的，尤其是div和table，div用於布局，table也可以用於布局，但不靈活，基本table用於處理數據。
2.學習css。
這里的css不包括css3。一般我們可以看到，在web前端開發工程師的要求中，有一個會使用css+html或css+div進行界面布局，所以css是用來輔助html進行布局和顯示的。css要熟練掌握float、position、width、height、最大最小，會使用100%、overflow、margin、pading等。
3.學習js。
其實js入門很簡單，不需要知道很多事情。只要你會根據某個id或者name獲得網頁dom或者樣式或者值，你就會給某個id或者name的元素標簽賦值，或者添加數據，追html。
4.學習jquery。
jquery相當於將js封裝成一套js插件，目的是操作起來更方便，代碼寫得更少，jquery入門也很簡單，那些入門需要學習的和js一樣，只是用jq代碼代碼代替。
5. 最好點擊後台語言，如java和php。
為什麼？因為我們前台界面的數據來自後台，如果我們能點擊後台代碼，我們就知道如何與後台交互數據是最好的，這樣可以節省時間，使前端代碼更加標准化。
6.學習css3+html5。
㈤ 帶你了解一些常見的開源Web前端框架
今天小編要跟大家分享的文章是關於帶你了解一些常見的開源Web前端框架。熟悉掌握HTML、伺服器端腳本語言、CSS和JavaScript之後，學習Web框架可以加快Web開發速度，節約時間。PHP程序員可選的框架包括CakePHP、CodeIgniter、Zend等，Python程序員喜歡使用Django和
Webpy，Ruby程序員常用RoR。
隨著Web越來越規范和標準的統一，Web組件化技術不斷革新，移動端開發不斷升華，以下是一些常見開源前端框架，來和小編一起看一看吧！
1、Bootstrap
主流框架之一，Bootstrap是基於HTML、CSS、JavaScript的，它簡潔靈活，使得Web開發更加快捷。
2、html5-boilerplate
該框架可以快速構建健壯，且適應力強的Webapp或網站。
3、Meteor
Meteor是新一代的開發即時Web應用的開源框架，它能在較短時間內完成開發。
4、SemanticUI
基於自然語言有效原則的UI組件框架
5、Foundation
優秀的響應式前端框架
6、Materialize
基於材料設計的現代化響應式前端框架。可提供默認的樣式，自定義組件。此外，Materialize還改進動畫和過渡，為開發人員提供流暢的體驗。
7、Pure
幾乎可以在每一個Web項目中使用的一組小的和響應式的CSS模塊。
8、Vue
Vue.js是用於構建互動式的Web界面的庫。它提供了MVVM數據綁定和一個可組合的組件系統，具有簡單、靈活的API。
9、Skeleton
Skeleton是一個小的JS和CSS文件的集合,可快速開發漂亮的網站,適合各種屏幕設備包括手機。Skeleton基於960grid
開發。它是一個UI框架。
10、AmazeUI
國內首個開源HTML5跨屏前端框架產品系列，中文排版支持更優、本土化組件豐富。該產品系列中有專門針對移動端的HTML5混合應用開發框架AmazeUI
Touch以及針對跨屏HTML5網頁開發的AmazeUIWeb。其中，AmazeUI
Touch可以幫助開發者通過豐富的組件，快速構建出與原生APP相媲美的專屬移動端的HTML5應用。
11、UIkit
一個輕量級的和模塊化的前端框架,用於快速開發和功能強大的Web介面。
12、Yui
Yahoo!UILibrary(YUI)是一個開放源代碼的JavaScript函數庫，為了能建立一個高互動的網頁，它採用了AJAX,
DHTML和DOM等程式碼技術。它也包含了許多CSS資源。使用授權為BSD許可證。
13、kissy
一款跨終端、模塊化、高性能、使用簡單的JavaScript框架。
14、MUI
最接近原生App體驗的前端框架的框架。
15、Arale
一個開放、簡單、易用的前端基礎類庫。
16、JX
JX是模塊化的非侵入式Web前端框架，特別適合構建和組織大規模、工業級的WebApp。
17、GMU
GMU是基於zepto的mobileUI組件庫，提供Webapp、pad端簡單易用的UI組件!WebApp。
18、ZUI
開源HTML5前端框架
19、CloudaTouch.js
Touch.js是移動設備上的手勢識別與事件庫,也是在網路內部廣泛使用的開發。
以上就是小編今天為大家分享的關於帶你了解一些常見的開源Web前端框架的文章，希望本篇文章能夠對正在從事Web前端工作的小夥伴們有所幫助，想要了解更多Web前端知識記得關注北大青鳥Web培訓官網，最後祝願小夥伴們工作順利，成為一名優秀的Web前端工程師。
㈥ 零基礎學習Web前端技術需要注意什麼
今天小編要跟大家分享的文章是關於零基礎學習Web前端技術需要注意什麼?對於零基礎的學員來說：初接觸一門技術，想要去了解他，並掌握它，是不是覺得有點無從下手，不知道該學習什麼?該先學哪個後學哪個?今天小編就為大家分享一些零基礎學習Web前端的學習思路，下面我們一起來看一看吧！
具體來說，前端方面的知識從重要程度來排，應該先後學這些：
1、第一步學習基礎知識
api學習，系統地學，可以看看這個方面的書，不要只零散地看網上文章，這個書錢要捨得花。前端領域，這個方面我推薦看看《javascript高級程序設計》和《html5和css3權威指南》。
2、第二步學習一些編程技巧
學習一些編程上的技巧，比如面向對象，組件，api設計，推薦幾本書《js設計模式》《headfirst設計模式》和《代碼整潔之道》。
3、第三步學習一些框架
學習除jqury之外的一兩個框架，因為jqury只是個庫，算不上框架，加上jqury
ui也仍然只是個庫。學學兩個前端框架，再學一個後端框架，加強對所謂框架的理解，回頭再來做框架選型，就可以有自己的理解和態度了，而不是跟風。
4、第四步學習一些編程工具
然後學的是工具類的，比如預處理器，打包工具，調試工具，開發工具啥的，less，sass，coffeescript，grunt，git，vim之流，晚點學不會死，甚至不學也不見得有啥問題，這種工具類的，一周一個，一下就入門了沒啥了不起，關鍵在於實不實用，不實用不用也罷，而實不實用就見仁見智了，我個人是不怎麼待見的。
5、第五步學習各種框架類庫
亂七八糟的各種框架類庫，這種東西看看就好，真有空就看看，多學點東西總是好的，不見得要用，看看人家設計理念也是好的。只是這種東西每年都出一波，然後大部分很快就消失了。真正能活下來的，還是能順利成為工業標準的東西，比如jquery和requirejs。
這只說了標准前端，建議大家在學習之前，不是想著趕緊掌握，用最短的時間學會，而是先想清楚，哪些東西是最核心最重要的，哪些是輔助性的，哪些是噱頭很可能只是曇花一現，哪些是花拳綉腿，哪些乾脆就是屠龍術。這么多待學的東西，你的時間真的值得花在錯誤或者不實用的地方嗎？
以上就是小編今天為大家分享的關於零基礎學習Web前端技術需要注意什麼的文章希望本篇文章能夠對正在學習Web前端工作的小夥伴們有所幫助。想要了解更多Web前端學習記得關注北大青鳥Web培訓官網！
本文來源：真阿當@微博
㈦ Web前端的流行框架推薦
今天小編要跟大家分享的文章是關於Web前端的流行框架推薦，正在從事Web相關工作的小夥伴們來和小編一起看一看吧，希望這些推薦的框架能夠對你有所幫助。
一、vue前端框架
Vue(讀音/vju_/，類似於view)是一套用於構建用戶界面的漸進式框架。與其它大型框架不同的是，Vue
被設計為可以自底向上逐層應用。Vue
的核心庫只關注視圖層，不僅易於上手，還便於與第三方庫或既有項目整合。另一方面，當與現代化的工具鏈以及各種支持類庫結合使用時，Vue
也完全能夠為復雜的單頁應用提供驅動。
如果你想在深入學習Vue之前對它有更多了解，我們製作了一個視頻，帶您了解其核心概念和一個示例工程。
如果你已經是有經驗的前端開發者，想知道Vue與其它庫/框架有哪些區別，請查看對比其它框架
vue學習官網：#/v2/guide/
vue中文社區：#/
二、React框架
React可以非常輕松地創建用戶交互界面。為你應用的每一個狀態設計簡潔的視圖，在數據改變時React也可以高效地更新渲染界面。
以聲明式編寫UI，可以讓你的代碼更加可靠，且方便調試。
React學習官網：#/
ReactNative中文網：#/
三、Angular框架
Angular是一個以JavaScript編寫的庫，擁有良好的應用程序，模板的功能非常強大，自帶豐富的angular指令，可以通過指令擴寬HTML，而且可以通過表達式綁定數據到HTML，因為引入了Java的一些內容，所以很容易就可以寫出復用代碼，有效提高了團隊開發的速度。
Angular學習官網：#/
AngularJs中文學習官網：#/
這是目前前端比較流行的框架，當然學習框架之前，一定要學好基礎，例如：Html5、Css3、Jscript以及響應互動式頁面搭建。
以上就是小編今天為大家分享的關於Web前端的流行框架推薦的文章，希望本篇文章能夠對正在從事Web前端工作的小夥伴們有所幫助。想要了解更多Web前端相關知識記得關注北大青鳥Web培訓官網。最後祝願小夥伴們工作順利！
㈧ web前端是幹嘛的
前端開發是創建WEB頁面或APP等前端界面呈現給用戶的過程，通過HTML，CSS及JavaScript以及衍生出來的各種技術、框架、解決方案，來實現互聯網產品的用戶界面交互 。
前端開發從網頁製作演變而來，名稱上有很明顯的時代特徵。在互聯網的演化進程中，網頁製作是Web1.0時代的產物，早期網站主要內容都是靜態，以圖片和文字為主，用戶使用網站的行為也以瀏覽為主。隨著互聯網技術的發展和HTML5、CSS3的應用，現代網頁更加美觀，交互效果顯著，功能更加強大。
前端開發跟隨移動互聯網發展帶來了大量高性能的移動終端設備應用。HTML5，Node.js的廣泛應用，各類UI框架，JS類庫層出不窮，開發難度也在逐步提升。
㈨ web前端框架有哪些
目前比較流行的前端框架是Angular、React、Vue、Bootstrap
如果基礎建議別看框架，先學習html、css、js（可以暫時不會寫，但必須會用），能獨立完成頁面編碼之後，再學習框架
㈩ Web前端工程師應該知道的Web前端開發框匯總!
今天小編要跟大家分享的文章是關於Web前端開發框匯總。一個前端開發框架其實就是一系列產品化的HTML/CSS/JavaScript組件的集合，我們可以在設計中使用它們。前端開發框架有很多，其中有一些寫得很棒。為了大家的使用便利，下文列舉了目前最強大應用最廣泛的幾款前端開發框架。記住，這些框架並不僅僅是CSS
柵格之類的一些東西，它們包括的是整套的前端開發框架。下面就讓我們一起來看一看吧!
一、Bootstrap
Boostrap絕對是目前最流行用得最廣泛的一款框架。它是一套優美，直觀並且給力的Web設計工具包，可以用來開發跨瀏覽器兼容並且美觀大氣的頁面。它提供了很多流行的樣式簡潔的UI組件，柵格系統以及一些常用的JavaScript插件。
Bootstrap是用動態語言LESS寫的，主要包括四部分的內容：
腳手架——全局樣式，響應式的12列柵格布局系統。記住Bootstrap在默認情況下並不包括響應式布局的功能。因此，如果你的設計需要實現響應式布局，那麼你需要手動開啟這項功能。
基礎CSS——包括基礎的HTML頁面要素，比如表格(table)，表單(form)，按鈕(button)，以及圖片(image)，基礎CSS為這些要素提供了優雅，一致的多種樣式。
組件——收集了大量可以重用的組件，如下拉菜單(dropdowns)，按鈕組(buttongroups)，導航面板(navigation
control)——包括：tabs,pills,lists標簽，麵包屑導航(breadcrumbs)以及頁碼(pagination)，縮略圖(thumbnails)，進度條(progress
bars)，媒體對象(mediaobjects)等等。
JavaScript——包括一系列jQuery的插件，這些插件可以實現組件的動態頁面效果。插件主要包括模態窗口(modals)，提示效果(tool
tips)，「泡芙」效果(popovers)，滾動監控(scrollspy)，旋轉木馬(carousel)，輸入提示(typeahead)，等等。
Bootstrap已經足夠強大，能夠實現各種形式的Web
界面。為了更加方便地利用Bootstrap進行開發，很多工具和資源可以用來配合使用，下面列舉了其中的一部分工具和資源。
jQueryUIBootstrap——對於jQuery和Bootstrap愛好者來說這是個非常好的資源，能夠把
Bootstrap的清爽界面組件引入到jQueryUI中。
jQueryMobileBootstrapTheme——和上面提到的jQueryUI主題類似，這是一個為jQuery
Mobile建立的主題。如果你想讓用Bootstrap開發的網站在手機端也可以優雅訪問，那麼這個資源對你來說很方便易用。
FuelUX——它為Bootstrap添加了一些輕量的JavaScript控制項。FuelUI安裝，修改，更新以及優化都很簡單方便。
#——
Bootstrap提供了自己的幾種界面風格，StyleBootstrap提供了更多的配色選項，並且你可以給每個組件都應用不同的配色。
BootSwatchr——
利用這個工具你可以立刻查看主題修改後的效果。對於每一次變動的效果，這個應用都會生成一個唯一的URL方便你與他人分享，你也可以在任意時刻修改你的主題。
Bootswatch——提供大量免費的Bootstrap主題。
Bootsnipp——在線前端框架交互組件製作工具，是一個供給設計師和開發者的基於BootstrapHTML/CSS/JavaScript
架構的免費元素。
LayoutIt——
通過界面拖放生成器簡便快捷地創建基於Bootstrap的前端代碼。通過拖放動作將Bootstrap風格的組件加入到你的個人設計里並且可以方便地修改他們的屬性，簡單便捷。
二、Fbootstrapp
Fbootstrapp基於Bootstrap並且提供了跟Facebookiframe
apps和設計相同的功能。包含用於所有標准組件的基本的CSS和HTML，包括排版、表單、按鈕、表格、柵格、導航等等，風格與Facebook類似。
三、BootMetro
BootMetro框架的靈感來自於MetroUICSS，基於Bootstrap框架構建，用於創建Windows8
的Metro風格的網站。它包括所有Bootstrap的功能，並添加了幾個額外的功能，比如頁面平鋪，應用程序欄等等。
四、Kickstrap
Kickstrap是Bootstrap的一個變體。它基於Bootstrap，並在它的基礎上添加了許多app，主題以及附加功能。這使得這個框架可以單獨地用於構建網站，而不需要額外安裝什麼。你需要做的僅僅是把它放到你的網站上，然後用就可以了。
App是一些頁面載入完成之後載入運行的JavaScript和CSS打包文件。默認載入的app有Knockout.js,Retina.js,
FirebugLite,andUpdater，你也可以自行添加更多的app。
選擇不同的主題可以讓你的網站在眾多Bootstrap構建的類似網站中顯得與眾不同。
附加功能是一些用來擴展BootstrapUI庫的附件，它們的語法基本相同或者相似。
五、Foundation
Foundation
是一款強大的，功能豐富的並且支持響應式布局的前端開發框架，你可以通過Foundation快速創建原型，利用它所包含的大量布局框架，元素以及最優範例快速創建在各種設備上可以正常運行的網站以及app。Foundation在構建的時候秉承移動優先的策略，它擁有大量實用的語義化功能，並且使用Zepto類庫來取代jQuery，這樣可以帶來更好的用戶體驗，並且提高運行的速度。
Foundation擁有一套12列的靈活可嵌套的網格系統，你可以用它快速創建適應多種瀏覽設備的布局。它有很多的功能。它定義了很多的樣式，比如字體排版，按鈕，表單，以及多種多樣的導航控制項。它也提供了很多的CSS組件，例如操作面板(panels)，價格表(price
tables)，進度條(progressbars)，表格(tables)以及可以適應不同設備的可伸縮視頻(flex
video)。與此同時，Foundation還包括了很多的JavaScript插件，如下拉菜單(dropdowns)，joyride(網站功能引導插件)，magellan(網站固定導航插件)，orbit(支持觸摸的響應式圖片輪播插件)，reveal(彈出框插件)，sections(強大的tab插件)以及tooltips(工具提示)等。
Foundation框架還提供了很多有用的擴展。
模板(Stencils)——Foundation框架中的所有UI元素都有Omnigraffle
stencils以及矢量PDF兩種格式的下載，你可以用它們來方便快捷的繪制線框圖和原型圖。
HTML模板——HTML模板可以方便地用來快速創建頁面布局。你所要做的僅僅是復製得到模板代碼，然後丟到頁面的標簽之間就好了。
圖標字體(IconFonts)——包含自定義圖標的一種網頁字體。
SVG社交網路圖標(SocialIcons)——一組不依賴解析度的社交網路圖標(可縮放矢量圖標)。
響應式表格——Foundation框架中響應式表格的實現機制是固定表格的左邊第一列，然後表格的其他列可以通過滾動條拖拉進行訪問。
關閉帆布布局(Off-CanvasLayouts)——
這些布局可以允許一些網頁內容或者導航控制項在移動端設備上默認隱藏，當瀏覽屏幕變大或者用戶進行相應操作的時候這些內容再出現。當用戶進行相關操作的時候，網頁內容或者導航控制項將會滑動出現。
如你所見，對於Web開發者以及設計師來說，Foundation就像是一個巨大的寶藏。在下載框架的時候，你可以自定義下載框架的內容。
六、GroundworkCSS
GroundworkCSS
是前端框架家族裡面新添的一款小清新框架。它是基於Sass和Compass的一個高級響應式的HTML5，CSS以及JavaScript工具包，可以用於快速創建原型並且建立在各種瀏覽設備上可以正常工作的網站和app。
GroundworkCSS擁有一個靈活，可嵌套的流式網格系統，方便你創建任何布局。這個框架有很多讓人印象深刻的功能，比如在平板以及移動端上的網格系統，當屏幕的寬度小於768或者480像素時，頁面中原本並列排版的表格列(grid
column)會自動變為獨立的行，而不是折疊在一起。另一個很酷的功能是jQuery的響應式文本(ResponsiveText)插件，這個插件可以動態調整頁面文字的大小以適應瀏覽設備的屏幕大小。這個插件對於可伸縮的標題以及創建響應式表格的時候特別有用。
GroundworkCSS包含了大量的UI組件，如tabs、響應式數據表格導航、按鈕、表單、響應式導航控制項、tiles(一套替代radio按鈕以及其他默認表單元素的優雅組件)、工具提示、對話框、Cycle2(一款強大的，響應式的內容滑塊)以及其他很多的有用組件。它還提供了很多矢量社交網路圖標以及圖標字體。
你可以通過切換頁面上方的導航按鈕選擇不同的瀏覽設備要來查看這款框架的效果。通過這種方式，你可以測試在不同的瀏覽設備上各種組件的響應式布局情況。
GroundworkCSS的文檔寫的非常好，並且包含著很多的示例，為了讓你更快的上手，他還提供了多種響應式的模板。對於這款框架，唯一我可以想到的缺點就是不能自定義要下載的框架內容。
七、Gumby
Gumby是一款基於Sass和Compass的簡單靈活並且穩定的前端開發框架。
它的流式-固定布局(fluid-fixed
layout)可以根據桌面端以及移動設備的解析度自動優化要呈現的網頁內容。它支持多種網格布局，包括多列混雜的嵌套模式。Gumby提供兩套PSD的模板，方便你在12列和16列的網格系統上進行設計。
Gumby提供了一個功能豐富的UI工具包，包括按鈕，表單，移動端導航，tabs，跳轉鏈接(skiplinks)，撥動開關(togglesand
switches，可以方便快捷地切換元素的class，而不需要進行額外的js操作)，抽屜功能(drawers)，響應式圖片以及retina圖片等等。為了緊跟最近的設計潮流，Gumby的UI元素中還包括了Metro風格的扁平化設計，你也可以用Pretty風格的漸變設計，或者按照你的想法糅合兩種設計風格。該框架還提供了一套出眾的響應式，擁有獨立解析度的Entypo圖標，你可以在自己的Web項目中盡情使用。
Gumby有一個很好自定義下載選擇器，你可以自行配置各個組件的顏色，並且按自己的需求方便地下載。
八、HTMLKickStart
HTMLKickstart
是一款可以用來方便創建任何布局的集合HTML5，CSS和jQuery的工具包。它提供了干凈，符合標准以及跨瀏覽器兼容的代碼。
這款框架提供了多種樣式表，包括網格，排版，表單，按鈕，表格，列表以及一些跨瀏覽器兼容的Web組件比如JavaScript的幻燈片功能，tabs，麵包屑導航，包含子菜單的菜單以及工具提示等等。
你可以使用99LimeUIKIT提供的UI組件來搭建你的產品線框圖。
九、IVORY
IVORY
是一款輕量，簡單但是強大的前端框架，可以用於320到1200像素寬度的響應式布局。它基於12列的響應式網格布局，包含表格，按鈕，表格，分頁，撥動開關，工具提示，手風琴，選項卡等網站中常用的組件和樣式。
當你需要一款輕量靈活，不需要額外的其他功能，並且適應不同瀏覽設備的框架時，IVORY是你最好的選擇。
十、Kube
最後，如果你的新項目需要一款實在的，不需要復雜的額外功能組件的，足夠簡單的框架，那麼Kube
將會是你正確的選擇。Kube是一款最小化的，支持響應式的前端框架，它沒有強加的樣式設計，因此給了你充分的自由來開發自己的樣式表。它提供了一些Web元素的基本樣式，比如網格，表單，排版，表格，按鈕，導航，鏈接以及圖片等等。
Kube框架包括一個簡潔的CSS文件用於方便地創建響應式布局，還包括了兩個JS文件來完成tab以及頁面的按鈕操作。如果你希望得到Kube最大化的靈活性以及個性化定製，那麼你可以下載開發者版本(developer
version)，這個版本包括了LESS文件(包括各種變數，mixins以及模塊)。
如何選擇一款優秀的前端開發框架?
將根據以下標准對這些框架進行評估：
·學習曲線
·針對簡單任務的開發效率
·針對復雜、特殊任務的開發效率
·依賴管理
·代碼性能/安全優化調整的能力
·平台升級/冗餘能力
·在企業市場中的認同度
·開發、使用SOAP和REST服務的復雜性
以上就是小編今天為大家分享的關於Web前端工程師應該知道的Web前端開發框匯總的文章希望本篇文章能夠對正在從事Web前端工作的小夥伴們有所幫助。想要了解更多Web前端知識記得關注北大青鳥Web前端培訓官網。最後祝願小夥伴們工作順利哦!
作者：獨家記憶0408