html5 跨屏前端框架有哪些

現(xiàn)在比較常用的就是Jjavascript和JQuery，這兩個(gè)大型企業(yè)和小公司都用，還有就是Bootstrap，BootMetro之類(lèi)的。

海珠網(wǎng)站建設(shè)公司創(chuàng)新互聯(lián),海珠網(wǎng)站設(shè)計(jì)制作，有大型網(wǎng)站制作公司豐富經(jīng)驗(yàn)。已為海珠成百上千提供企業(yè)網(wǎng)站建設(shè)服務(wù)。企業(yè)網(wǎng)站搭建\成都外貿(mào)網(wǎng)站建設(shè)公司要多少錢(qián)，請(qǐng)找那個(gè)售后服務(wù)好的海珠做網(wǎng)站的公司定做！

HTML5有哪些主流框架

對(duì)于參加杭州Web前端培訓(xùn)班的人來(lái)說(shuō)，他們的課程安排是從基礎(chǔ)到進(jìn)階，并由專(zhuān)業(yè)的老師引導(dǎo)教學(xué)。在具備一定的理論基礎(chǔ)之后，還需要學(xué)習(xí)前端框架，目的是減少重復(fù)的勞動(dòng)，提高工作效率并增加安全性，而這也是很多企業(yè)在面試過(guò)程中經(jīng)常提問(wèn)的知識(shí)點(diǎn)。今天就給大家介紹一下Web前端三大主流框架。

目前比較流行的前端三大框架是Angular、React、Vue，三者各有所長(zhǎng)。

1、Angular

Angular是一個(gè)JavaScript框架，最為核心的是：MVC(Model–view–controller)、模塊化、自動(dòng)化雙向數(shù)據(jù)綁定、語(yǔ)義化標(biāo)簽、依賴(lài)注入等等。Angular通過(guò)指令擴(kuò)展了HTML，以一個(gè) JavaScript文件形式發(fā)布，通過(guò)script標(biāo)簽添加到網(wǎng)頁(yè)中。Angular的優(yōu)勢(shì)在于：零配置、深度整合設(shè)計(jì)模式、約定才是框架的本質(zhì)。不過(guò)對(duì)于JavaScript工程師來(lái)說(shuō)，少有工程化的經(jīng)驗(yàn)，學(xué)習(xí)起來(lái)會(huì)比較痛苦。

2、React

React是一個(gè)Facebook和Instagram用來(lái)創(chuàng)建用戶(hù)界面的JavaScript庫(kù)，用于構(gòu)建頁(yè)面、Javascript庫(kù)。主要功能是對(duì)DOM操作，聲明式設(shè)計(jì)，更快的開(kāi)發(fā)出Web應(yīng)用系統(tǒng)。借助React，你可以非常輕松地創(chuàng)建用戶(hù)交互界面，為你應(yīng)用的每一個(gè)狀態(tài)設(shè)計(jì)簡(jiǎn)潔的視圖。在數(shù)據(jù)改變時(shí)，React也可以高效地更新渲染界面。

3、Vue

Vue是用于構(gòu)建交互式的Web界面的庫(kù)，它提供了MVVM數(shù)據(jù)綁定和一個(gè)可組合的組件系統(tǒng)，具有簡(jiǎn)單、靈活的 API。從技術(shù)上講，Vue集中在MVVM模式上的視圖模型層，并通過(guò)雙向數(shù)據(jù)綁定連接視圖和模型。實(shí)際的DOM操作和輸出格式被抽象出來(lái)成指令和過(guò)濾器，相比其它的MVVM框架，Vue更容易上手。

綜上所述，在大型超大型Web應(yīng)用開(kāi)發(fā)上比較看好Angular，個(gè)性化需求、中型應(yīng)用更傾向選擇React，在小型應(yīng)用上則看好Vue。當(dāng)然不同企業(yè)會(huì)有不同的需求，所選用的框架也不一樣，但只要你具備扎實(shí)的理論基礎(chǔ)，就可以很快上手這些框架。

手機(jī)html5前端開(kāi)發(fā)用什么框架

jquery mobile和bootstrap都是較好的框架。為了使用便利，下文列舉了目前最強(qiáng)大應(yīng)用最廣泛的幾款前端開(kāi)發(fā)框架。

1. Bootstrap

Boostrap絕對(duì)是目前最流行用得最廣泛的一款框架。它是一套優(yōu)美，直觀并且給力的web設(shè)計(jì)工具包，可以用來(lái)開(kāi)發(fā)跨瀏覽器兼容并且美觀大氣的頁(yè)面。它提供了很多流行的樣式簡(jiǎn)潔的UI組件，柵格系統(tǒng)以及一些常用的JavaScript插件。

2. Fbootstrapp

Fbootstrapp基于Bootstrap并且提供了跟Facebook iframe apps和設(shè)計(jì)相同的功能。包含用于所有標(biāo)準(zhǔn)組件的基本的CSS和HTML，包括排版、表單、按鈕、表格、柵格、導(dǎo)航等等，風(fēng)格與Facebook類(lèi)似。

3. BootMetro

BootMetro框架的靈感來(lái)自于Metro UI CSS，基于Bootstrap 框架構(gòu)建，用于創(chuàng)建Windows 8 的Metro風(fēng)格的網(wǎng)站。它包括所有Bootstrap的功能，并添加了幾個(gè)額外的功能，比如頁(yè)面平鋪，應(yīng)用程序欄等等。

4. Kickstrap

Kickstrap是Bootstrap的一個(gè)變體。它基于Bootstrap，并在它的基礎(chǔ)上添加了許多app，主題以及附加功能。這使得這個(gè)框架可以單獨(dú)地用于構(gòu)建網(wǎng)站，而不需要額外安裝什么。你需要做的僅僅是把它放到你的網(wǎng)站上，然后用就可以了。

5. Foundation

Foundation 是一款強(qiáng)大的，功能豐富的并且支持響應(yīng)式布局的前端開(kāi)發(fā)框架，你可以通過(guò)Foundation快速創(chuàng)建原型，利用它所包含的大量布局框架，元素以及最優(yōu)范例快速創(chuàng)建在各種設(shè)備上可以正常運(yùn)行的網(wǎng)站以及app。Foundation在構(gòu)建的時(shí)候秉承移動(dòng)優(yōu)先的策略，它擁有大量實(shí)用的語(yǔ)義化功能，并且使用Zepto類(lèi)庫(kù)來(lái)取代jQuery，這樣可以帶來(lái)更好的用戶(hù)體驗(yàn)，并且提高運(yùn)行的速度。

6. GroundworkCSS

GroundworkCSS 是前端框架家族里面新添的一款小清新框架。它是基于Sass和Compass的一個(gè)高級(jí)響應(yīng)式的HTML5，CSS以及JavaScript工具包，可以用于快速創(chuàng)建原型并且建立在各種瀏覽設(shè)備上可以正常工作的網(wǎng)站和app。

7. Gumby

Gumby 是一款基于Sass和Compass的簡(jiǎn)單靈活并且穩(wěn)定的前端開(kāi)發(fā)框架。

它的流式-固定布局（fluid-fixed layout）可以根據(jù)桌面端以及移動(dòng)設(shè)備的分辨率自動(dòng)優(yōu)化要呈現(xiàn)的網(wǎng)頁(yè)內(nèi)容。它支持多種網(wǎng)格布局，包括多列混雜的嵌套模式。Gumby提供兩套PSD的模板，方便你在12列和16列的網(wǎng)格系統(tǒng)上進(jìn)行設(shè)計(jì)。

8. HTML KickStart

HTML Kickstart 是一款可以用來(lái)方便創(chuàng)建任何布局的集合HTML5，CSS和jQuery的工具包。它提供了干凈，符合標(biāo)準(zhǔn)以及跨瀏覽器兼容的代碼。

9. IVORY

IVORY 是一款輕量，簡(jiǎn)單但是強(qiáng)大的前端框架，可以用于320到1200像素寬度的響應(yīng)式布局。它基于12列的響應(yīng)式網(wǎng)格布局，包含表格，按鈕，表格，分頁(yè)，撥動(dòng)開(kāi)關(guān)，工具提示，手風(fēng)琴，選項(xiàng)卡等網(wǎng)站中常用的組件和樣式。

10.Kube

最后，如果你的新項(xiàng)目需要一款實(shí)在的，不需要復(fù)雜的額外功能組件的，足夠簡(jiǎn)單的框架，那么 Kube 將會(huì)是你正確的選擇。Kube是一款最小化的，支持響應(yīng)式的前端框架，它沒(méi)有強(qiáng)加的樣式設(shè)計(jì)，因此給了你充分的自由來(lái)開(kāi)發(fā)自己的樣式表。它提供了一些web元素的基本樣式，比如網(wǎng)格，表單，排版，表格，按鈕，導(dǎo)航，鏈接以及圖片等等。

前端常用的框架有哪些？

給大家介紹幾個(gè)在Web前端界比較優(yōu)秀的前端框架。

1、Bootstrap

Twitter出品的Bootstrap在業(yè)界是非常受歡迎的，以致于有很多前端框架都在其基礎(chǔ)上開(kāi)發(fā)，如我們熟悉的WeX5就是在Bootstrap源碼基礎(chǔ)上優(yōu)化而來(lái)的。我相信大多數(shù)接觸過(guò)前端開(kāi)發(fā)的同學(xué)多少都了解過(guò)這個(gè)優(yōu)秀的前端框架。Bootstrap是基于HTML、CSS和Javascript的，它簡(jiǎn)潔靈活，可以使得Web開(kāi)發(fā)更加敏捷。

它提供優(yōu)雅的HTML和CSS規(guī)范，在jQuery的基礎(chǔ)上進(jìn)行更加個(gè)性化和人性化的完善。兼容大部分jQuery插件，并包含了豐富的Web組件，如下拉菜單、按鈕式下拉菜單、導(dǎo)航條、按鈕組、分頁(yè)、縮略圖、進(jìn)度條和媒體對(duì)象等。自帶了13個(gè)jQuery插件，其中有模式對(duì)話框、標(biāo)簽頁(yè)、滾動(dòng)條和彈出框等。

2、Foundation框架

Foundation框架總體來(lái)看要比Bootstrap略顯高大上一點(diǎn)，但他們倆的設(shè)計(jì)理念都是非常清楚的，Bootstrap有引導(dǎo)的意思，它嘗試處理你項(xiàng)目中的一切所需。Foundation有基礎(chǔ)、地基及支柱的意思，給你項(xiàng)目中強(qiáng)有力的創(chuàng)造與支持。相對(duì)于Bootstrap豐富的組件及插件，F(xiàn)oundation僅提供了有限的幾種元素，其目標(biāo)是，即使你使用預(yù)定義的UI元素，也不應(yīng)該與大家的網(wǎng)站長(zhǎng)得太像。

而B(niǎo)ootstrap則致力于提供所有定義好的元素，這樣使得看起來(lái)許多網(wǎng)站都差不多。Foundation默認(rèn)不帶圖標(biāo)集，它推薦使用開(kāi)源字體圖標(biāo)。與Bootstrap一樣，F(xiàn)oundation使用網(wǎng)格流式布局將網(wǎng)頁(yè)劃分為12列，針對(duì)不同的設(shè)備顯示不同的列數(shù)，實(shí)現(xiàn)響應(yīng)式布局。但Foundation不支持舊版本瀏覽器。其他特性如有興趣可進(jìn)一步了解。

3、Curl

Curl 是一個(gè)命令行工具，用于通過(guò) HTTP(s)、FTP 和數(shù)十種其它協(xié)議進(jìn)行請(qǐng)求。使用Curl可以進(jìn)行文件下載、檢查響應(yīng)標(biāo)題和自由訪問(wèn)遠(yuǎn)程數(shù)據(jù)。

在 Web 開(kāi)發(fā)中，Curl 經(jīng)常和 RESTful API 一起使用，用于測(cè)試連接。

# Fetch the headers of a URL.curl -I 302 FoundCache-Control: privateContent-Type: text/html; charset=UTF-8Referrer-Policy: no-referrerLocation: ;ei=0fCKWe6HCZTd8AfCoIWYBQContent-Length: 258Date: Wed, 09 Aug 2017 11:24:01 GMT# Make a GET request to a remote API.curl is the number of days it takes Saturn to orbit the Sun.

Curl 命令可能比上述代碼更復(fù)雜。有許多選項(xiàng)用于控制 headers、Cookie、身份驗(yàn)證等。了解更多，請(qǐng)閱讀Everything curl。

4、Tree

Tree 是一個(gè)小型的命令行實(shí)用程序，它將目錄中的文件以可視化的方式進(jìn)行顯示。它采用遞歸運(yùn)行的方式，遍歷每個(gè)級(jí)別的嵌套并繪制所有內(nèi)容的格式樹(shù)。這樣就能快速的瀏覽并查找需要的文件。

tree.├── css│ ├── bootstrap.css│ ├── bootstrap.min.css├── fonts│ ├── glyphicons-halflings-regular.eot│ ├── glyphicons-halflings-regular.svg│ ├── glyphicons-halflings-regular.ttf│ ├── glyphicons-halflings-regular.woff│ └── glyphicons-halflings-regular.woff2└── js ├── bootstrap.js └── bootstrap.min.js

還可以使用簡(jiǎn)單的 regEx 模式來(lái)過(guò)濾結(jié)果：

tree -P '*.min.*'.├── css│ ├── bootstrap.min.css├── fonts└── js └── bootstrap.min.js

5、Tmux

根據(jù)維基的解釋?zhuān)琓mux 是一個(gè)終端復(fù)用器。通俗的說(shuō)，它是一個(gè)能將多個(gè)終端連接到單個(gè)終端會(huì)話的工具。

Tmux允許用戶(hù)在終端中的程序之間切換，添加屏幕窗格，并將多個(gè)終端連接到同一個(gè)會(huì)話，使其保持同步。在遠(yuǎn)程服務(wù)器上工作時(shí)，Tmux 特別有用，因?yàn)樗试S用戶(hù)創(chuàng)建新的選項(xiàng)卡，而無(wú)需再次登錄。

6、du

du命令用于生成關(guān)于文件和目錄的空間使用情況的報(bào)告。du很容易使用，可以遞歸地運(yùn)行，遍歷每個(gè)子目錄并返回每個(gè)文件的大小。

du 的常見(jiàn)用例是：當(dāng)某個(gè)驅(qū)動(dòng)器的空間不足，用戶(hù)不清楚每個(gè)存儲(chǔ)器的大小。使用此命令可以快速查看每個(gè)文件夾所占用的存儲(chǔ)空間，從而找到占用最大空間的存儲(chǔ)器。

7、AUI

AUI是最近流行起來(lái)的，作者聲稱(chēng)是專(zhuān)為APIClound設(shè)計(jì)的一套框架，解決了許多移動(dòng)端開(kāi)發(fā)實(shí)際中遇到的許多問(wèn)題，是一個(gè)純CSS框架。使用容器+布局+模塊的構(gòu)建方式，JS輔助，更自由更靈活更易于擴(kuò)展使用。遵循Google Material設(shè)計(jì)規(guī)范，完美適配各個(gè)機(jī)型。面向HTML5，使用CSS3實(shí)現(xiàn)動(dòng)畫(huà)交互，輕量級(jí)高性能。AUI是使用MIT License授權(quán)，你可以復(fù)制、出售。目前最新版本2.0。

8、Amaze UI

這是稱(chēng)為妹子UI的開(kāi)源框架，據(jù)稱(chēng)是中國(guó)首個(gè)開(kāi)源HTML5跨屏前端框架。妹子UI以移動(dòng)優(yōu)先為理念，從小屏逐漸到大屏，實(shí)現(xiàn)響應(yīng)式網(wǎng)頁(yè)。Amaze UI包含20+個(gè)CSS組件、20+個(gè)JS組件，更有多個(gè)包含不同主題的Web組件。相比國(guó)外框架，妹子UI關(guān)注中文排版提供本地化支持。面向HTML5開(kāi)發(fā)，使用CSS3來(lái)實(shí)現(xiàn)動(dòng)畫(huà)交互，輕量級(jí)高性能。

9、Frozen UI

Frozen UI是一款開(kāi)源，簡(jiǎn)單易用，輕量敏捷的移動(dòng)端框架?；谑諵樣式規(guī)范，目前全面應(yīng)用于企鵝手Q增值業(yè)務(wù)中?；A(chǔ)樣式效果簡(jiǎn)單色調(diào)清爽，社區(qū)活躍，組件自然不少。包括按鈕、列表、表單、通知、提示條、彈出框、選項(xiàng)卡等等常用組件。還包括一個(gè)FrozenJs的JS組件庫(kù)?？梢栽谥髁鞯腁ndroid和IOS上應(yīng)用?；緲邮绞褂秒x線包的方式減少請(qǐng)求提供快速接入方案。當(dāng)然，根據(jù)網(wǎng)友反映，也存在大大小小的bug。不過(guò)總體來(lái)說(shuō)，還是值得一用的。奇怪的是，Github上顯示的最后更新時(shí)間是一年前，難道已經(jīng)沒(méi)人維護(hù)了嗎？

# Running this will show the space usage of each folder in the current directory.# The -h option makes the report easier to read.# -s prevents recursiveness and shows the total size of a folder.# The star wildcard (*) will run du on each file/folder in current directory.du -sh *1.2G Desktop4.0K Documents40G Downloads4.0K Music4.9M Pictures844K Public4.0K Templates6.9M Videos

還有一個(gè)相似的命令 df（Disk Free），使用df會(huì)返回有關(guān)可用磁盤(pán)空間的各種信息。

以上介紹了現(xiàn)在熱門(mén)的幾個(gè)Web前端框架，以及它們的主要功能，希望對(duì)大家學(xué)習(xí)Web前端有所幫助。

html5前端開(kāi)發(fā)，有沒(méi)有比較好的前端框架

現(xiàn)在主流就幾個(gè)，國(guó)內(nèi)使用VUE的比較多，優(yōu)點(diǎn)是：國(guó)人做的，文檔閱讀，完善都不錯(cuò)。淘寶，知乎和國(guó)外的大廠使用的React較多，優(yōu)點(diǎn)是和原生交互會(huì)簡(jiǎn)單點(diǎn)，但入門(mén)要求會(huì)比VUE高點(diǎn)，還有就是angular，這個(gè)我沒(méi)用過(guò)，不好評(píng)價(jià)，你如果用了，歡迎交流