Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
應(yīng)式網(wǎng)站開發(fā)在國(guó)內(nèi)越來越普遍,一來展現(xiàn)效果好,而來收錄情況佳,讓專門開發(fā)響應(yīng)式網(wǎng)站的程序員成了香餑餑。程序員們想要更有效率開發(fā)響應(yīng)式網(wǎng)站,這9個(gè)熱門HTML5框架可不容錯(cuò)過。
①Twitter Bootstrap
基于HTML、CSS、Javascript,簡(jiǎn)單靈活快捷,是目前很火的前端框架。
②52Framework
能實(shí)現(xiàn)HTML5+CSS3+JS,能在包括IE6在內(nèi)的所有主流瀏覽器運(yùn)行。
③SproutCore
利用MVC架構(gòu)規(guī)范構(gòu)建而成,能與任何后端服務(wù)器技術(shù)搭配使用。一旦部署之后,SproutCore應(yīng)用只包含標(biāo)準(zhǔn)的HTML、JavaScript以及CSS。只需使用Apache就能部署完整的SproutCore應(yīng)用。
④Onsen UI
側(cè)重于創(chuàng)建移動(dòng)應(yīng)用,用于構(gòu)建PhoneGap/Cordova應(yīng)用。
⑤Foundation
提供多種web上的UI組件,如按鈕、表單等,可用于構(gòu)建基于任何設(shè)備上的web應(yīng)用。
⑥Ionic
Ionic非常漂亮,支持使用HTML5開發(fā)混個(gè)移動(dòng)應(yīng)用前端框架。
⑦Enyo
適用于開發(fā)與原生應(yīng)用類似的HTML 5應(yīng)用。
⑧GroundworkCSS 2
擁有一個(gè)靈活的、可嵌套的網(wǎng)格系統(tǒng),可以創(chuàng)建適應(yīng)多種瀏覽設(shè)備的布局。要用于快速構(gòu)建響應(yīng)式Web應(yīng)用程序。
⑨MontageJS
可用于構(gòu)建高可擴(kuò)展性和可維護(hù)性的HTML5應(yīng)用。是一個(gè)現(xiàn)代化、完整的HTML5框架,旨在創(chuàng)建單頁的應(yīng)用程序。
此外,想開發(fā)HTML5響應(yīng)式網(wǎng)站,還可以借助建站工具。筆者用過一款叫建站寶盒的網(wǎng)站開發(fā)工具,做出來的網(wǎng)站可以和專業(yè)開發(fā)網(wǎng)站媲美,不要求程序基礎(chǔ)。有需要的可以了解一下。
這篇文章分享之后我還是要推薦下我自己的前端學(xué)習(xí)群:527535103 ,不管你是小白還是大牛,小編我都挺歡迎,不定期分享干貨,包括我自己整理的一份2017最新前端資料和零基礎(chǔ)入門教程,歡迎初學(xué)和進(jìn)階中的小伙伴
動(dòng)端web開發(fā)框架、類庫和UI組件簡(jiǎn)介,有需要的收藏一波。
react-native
一個(gè)基于React的創(chuàng)建原生APP的框架
html5-boilerplate
一個(gè)用來構(gòu)建快速、強(qiáng)大、可適配的webapp的前端模板
ionic
領(lǐng)先的HTML5移動(dòng)開發(fā)框架和SDK,利用你所熟知的web技術(shù)構(gòu)建難以置信的移動(dòng)應(yīng)用,是AngularJS最好的朋友。
weui
由微信官方設(shè)計(jì)團(tuán)隊(duì)為微信Web開發(fā)量身打造的框架,包含移動(dòng)web應(yīng)用開發(fā)中有用的組件和模塊
hammer.js
實(shí)現(xiàn)多點(diǎn)觸控的javascript庫
weex
阿里推出的跨平臺(tái)的移動(dòng)端開發(fā)框架,具有輕量級(jí)、可擴(kuò)展和高性能的特點(diǎn)
fastclick
一個(gè)消除移動(dòng)端瀏覽器上的點(diǎn)擊事件的300ms的延遲
zepto
Zepto.jsisaminimalistJavaScriptlibraryformodernbrowsers,withajQuery-compatibleAPI
vux
基于Vue和Weui的移動(dòng)端框架
wepy
騰訊團(tuán)隊(duì)推出的小程序組件化開發(fā)框架
NativeScript
NativeScript是一個(gè)利用JavaScript等WEB技術(shù)創(chuàng)建原生APP的框架
Framework7
功能強(qiáng)大的創(chuàng)建iOS&AndroidAPP的HTML框架
mui
最接近原生APP體驗(yàn)的高性能框架
ratchet
用簡(jiǎn)單的HTML,CSS,和JavaScript組件創(chuàng)建移動(dòng)應(yīng)用
react-native-elements
ReactNativeUI組件庫
mint-ui
基于vue.js的移動(dòng)端UI框架
amazeui
移動(dòng)端優(yōu)先的開源HTML5跨屏前端框架,俗稱妹子UI
jquery-mobile
jQuery移動(dòng)開發(fā)框架
Mars
騰訊移動(dòng)Web前端知識(shí)庫
interact.js
JavaScriptdraganddrop,resizingandmulti-touchgestureswithinertiaandsnappingformodernbrowsers(andalsoIE8+)
vant
有贊開發(fā)的基于Vue.js2.0的UI組件庫
OnsenUI
用來構(gòu)建混合移動(dòng)端APP的HTML5UI框架
muse-ui
基于Vue2.0和MaterialDesigin的UI組件庫
SUI-Mobile
SUIMobile(MSUI)是由阿里巴巴國(guó)際UED前端出品的一個(gè)手機(jī)端的UI庫,輕量精美。更多信息請(qǐng)參考官網(wǎng)
ant-design-mobile
一個(gè)可配置的移動(dòng)端UI框架
TouchSwipe-Jquery-Plugin
TouchSwipeisajqueryplugintobeusedwithjQueryontouchinputdevicessuchasiPad,iPhoneetc.
jquery-weui
創(chuàng)建微信混合app的UI庫
jquery-ui-touch-punch
AduckpunchforaddingtoucheventstojQueryUI
device.js
Device.jsmakesiteasytowriteconditionalCSS_and/or_JavaScriptbasedondeviceoperatingsystem(iOS,Android,Blackberry,Windows,FirefoxOS,MeeGo),orientation(Portraitvs.Landscape),andtype(Tabletvs.Mobile).
react-native-ui-kitten
可定制和可重用的react-native組件包
iview-weapp
一套高質(zhì)量的微信小程序UI組件庫
vonic
基于Vue.js和ionic組件的SPAUI框架
brick
UIWebComponentsforModernWebApps
app
App.js是一個(gè)用來創(chuàng)建移動(dòng)webapp的輕量級(jí)JavaScriptUI框架,可以表現(xiàn)得像原生APP而又不犧牲性能和優(yōu)雅
Lungo.js
一個(gè)給開發(fā)者提供的設(shè)計(jì)、構(gòu)建、分享跨設(shè)備應(yīng)用的框架
AlloyFinger
騰訊Web前端團(tuán)隊(duì)推出的輕量級(jí)的多點(diǎn)觸控手勢(shì)庫
FooTable
jQueryplugintomakeHTMLtablesresponsive
vue-ydui
一個(gè)基于Vue2.x的移動(dòng)端組件庫
wechat-h5-boilerplate
為騰訊微信優(yōu)化的H5動(dòng)效模板,幫助你快速構(gòu)建全屏滾動(dòng)型H5頁面
slip
通過滑動(dòng)和拖動(dòng)手勢(shì)操作列表的UI庫
mobi.css
一個(gè)關(guān)注于移動(dòng)端的輕量級(jí)的、靈活的css框架,
vue-touch
Vue.js的Hammer.js包裝器
QuoJS
針對(duì)移動(dòng)設(shè)備的微型JavaScript庫
pressure
:point_down::boom:JavaScriptlibraryforhandlingbothForceTouchand3DTouchontheweb
junior
一個(gè)創(chuàng)建類似原生APP的html5應(yīng)用的前端框架
vum
為手機(jī)webapp打造的基于Vue.js構(gòu)建的UI框架
mobiscroll
ThecustomizablemobileUIlibraryfortouchdeviceslikesmartphonesandtablets
zingtouch
一個(gè)JavaScript觸摸手勢(shì)檢測(cè)庫
montage
montagejs是一個(gè)優(yōu)雅的、開源的HTML5框架。它提供了模塊化組件,雙向數(shù)據(jù)綁定,以及更多功能
pushy
Pushyisaresponsiveoff-canvasnavigationmenuusingCSStransforms&transitions
GMU
基于zepto的ui組件庫,適用于移動(dòng)端
flex.css
flex.cssis是一個(gè)聲明式的布局框架,能夠兼容多個(gè)MVVM框架和瀏覽器
mobilebone
單頁切換骨架。適用于移動(dòng)webAPP,Hybrid混合APP,Phonegap開發(fā),無兼容要求單頁P(yáng)C應(yīng)用等
jquery.pep.js
Pep,alightweightpluginforkineticdragonmobile/desktop
Cloudajs
CloudaFramework-一個(gè)針對(duì)移動(dòng)WebApp的實(shí)時(shí)JavaScriptRIA框架
jo
Jo(0.5.0)是一個(gè)輕量級(jí)的(~16K)創(chuàng)建HTML5應(yīng)用的外殼。可以和PhoneGap,Chrome,Safari,Opera,FireFox,iOS,Android,BlackBerry10,Tizen,&WindowsPhone8+一起工作
touchui
高質(zhì)量移動(dòng)端UI框架
iosselect
一個(gè)簡(jiǎn)潔好看的模仿ios的webapp下拉菜單
mand-mobile
面向金融場(chǎng)景的Vue移動(dòng)端UI組件庫,豐富、靈活、實(shí)用,快速搭建優(yōu)質(zhì)的金融類產(chǎn)品
tabris-js
tabris.js-用JavaScript開發(fā)原生應(yīng)用
aui
移動(dòng)端UI快速布局解決方案(APICloudUI框架)
vue-carbon
基于vue開發(fā)的materialdesignui庫
cordova-plugin-ibeacon
AniBeaconpluginforPhonegap/Cordova3.xandupwards.SupportsbothiOSandAndroid(contributionsarewelcome)
touch.code.baidu.com
TouchOfficalSite
bindingx
阿里團(tuán)隊(duì)推出的weex和ReactNative上富交互問題的一種解決方案
jQuery-Touch-Events
AcollectionofmobileeventpluginsforjQuery.
TinyNav.js
Responsivenavigationpluginthatweighsjust443bytes
Jingle
JingleUI是一個(gè)基于html5、css3開發(fā)輕量級(jí)的移動(dòng)webapp框架,提供一些基本交互方式,幫助您更方便的開發(fā)移動(dòng)應(yīng)用。
light7
一個(gè)輕量級(jí)的易用的移動(dòng)端UI框架
framework7-vue
基于Framework7和Vue構(gòu)建iOS和Android應(yīng)用
ydui
一只注重審美,且性能高效的移動(dòng)端&微信UI
slip.js
移動(dòng)端跟隨手指滑動(dòng)組件,零依賴。
wepayui
微信支付場(chǎng)景化組件,wepayui源碼
BlendUI
BlendUI是Clouda+中的重要組成部分,他能讓webapp的用戶界面體驗(yàn)和交互能和Native媲美
toucher
面向移動(dòng)端的手勢(shì)類庫
touchjs
一個(gè)移動(dòng)端手勢(shì)檢測(cè)庫
thumbs.js
Addtouchsupporttoyourbrowserwiththumbs.js-asmall,transparent,andsyntax-lesslibrary.
JMUI
移動(dòng)Web開發(fā)UI組件庫
JM
面向Mobile的極致JavaScript庫
react-ui
為React打造的一套ionic風(fēng)格的可復(fù)用UI組件庫
Zoomage.js
Zoomage.js-一個(gè)通過手勢(shì)縮放圖片的庫
touchSlider
TouchSliderjQueryPlugin
如今移動(dòng)端開發(fā)領(lǐng)域H5勢(shì)頭越來越猛,不管是H5小應(yīng)用、小游戲,還是hybrid混合開發(fā)都有不少市場(chǎng)。原生端APP開發(fā)越來越不能滿足快速迭代的訴求。而隨著手機(jī)硬件配置的不斷增強(qiáng)。以前抱怨的手機(jī)端web app性能低下聲音也越來越少了。下面隨小編一起來看下,這么多年來喬老爺子推崇的HTML5進(jìn)化到了哪種程度。炸裂推薦50+款流行框架,不論新舊,總有一款適合你。
RAD.js
rad.js是一個(gè)快速建立移動(dòng)應(yīng)用程序的框架。優(yōu)化iOS,Android和Windows Phone 8,以及支持所有主流的Web瀏覽器。
查看地址:http://rad-js.com/
Ionic
Ionic是一款接近原生體驗(yàn)的Html5移動(dòng)APP開發(fā)框架。Ionic既是一個(gè)CSS框架也是一個(gè)JavaScript UI庫。通過SASS + AngularJS + Cordova 來構(gòu)建應(yīng)用程序,它提供了很多UI組件來幫助開發(fā)者開發(fā)強(qiáng)大的應(yīng)用。能想到的基礎(chǔ)組件都能在這里找到。結(jié)合豐富的Cordova插件,提升與原生交互功能。在iOS和Android端用戶體驗(yàn)上有不錯(cuò)的表現(xiàn)。
查看地址:http://ionicframework.com/
LungoJS
一款向需要設(shè)計(jì)構(gòu)建跨終端應(yīng)用的開發(fā)者提供的HTML5框架。
查看地址:http://lungo.tapquo.com/
Mobile Angula UI
一款基于Bootstrap3和Angular的手機(jī)端HTML5 UI框架。
查看地址:http://mobileangularui.com/
NativeScript
使用Angular,TypeScript或者原生JavaScript來構(gòu)建真正原生手機(jī)APP的開源框架。
查看地址:https://www.nativescript.org/
Sencha Touch
如果你使用過Ext,easyUI這類框架來構(gòu)建web2.0時(shí)代管理臺(tái)的話,那么你使用Sencha Touch時(shí)一定不會(huì)感到陌生。一款基于html5和JavaScript的跨平臺(tái)手機(jī)應(yīng)用框架。
查看地址:http://www.sencha.com/products/touch/#overview
PhoneGap
要想將制作好大web app放到手機(jī)里,逃不開應(yīng)用打包的過程。大名鼎鼎PhoneGap就是加殼工程的鼻祖。現(xiàn)如今開源部分改名為Cordova。強(qiáng)大的插件機(jī)制,讓web前端開發(fā)者有機(jī)會(huì)體會(huì)原生組件的魅力。想要自己封裝hybrid應(yīng)用,學(xué)習(xí)Cordova源碼里的優(yōu)化設(shè)計(jì)代碼是一個(gè)非常重要的部分。
查看地址:http://phonegap.com/
RhoMobile
面向消費(fèi)者與企業(yè)開發(fā)人員的移動(dòng)應(yīng)用程序平臺(tái)。
查看地址:http://rhomobile.com/
jQuery Mobile Framework
jQuery大名不用小編介紹了,jQuery mobile是一款早期推出的手機(jī)端跨終端UI組件庫。和jQuery UI風(fēng)格類似。喜歡使用jQuery的朋友不要錯(cuò)過。
查看地址:https://jquerymobile.com/
Onsen UI
基于自定義元素構(gòu)建移動(dòng)前端的HTML5框架。
查看地址:http://onsen.io/
Apache Flex
一款構(gòu)建web與手機(jī)應(yīng)用的開源項(xiàng)目框架。從早期adobe Flash中分離出來,出使用action script或者h(yuǎn)5的方式構(gòu)建富客戶端,以flash player,或者adobe air運(yùn)行時(shí)環(huán)境。
查看地址:https://flex.apache.org/
Agate Mobile Application Framework
一款跨平臺(tái)開發(fā)ios、Android原生應(yīng)用,不能用于開發(fā)web app。
查看地址:http://applusform.com/en/
eMobc
用XML來開發(fā)生成web、手機(jī)和原生端應(yīng)用的開源框架。
查看地址:http://www.emobc.com/
AppGyver Steroids
構(gòu)建混合應(yīng)用程序所需的工具集,提供iOS和Android的測(cè)試人員和開發(fā)人員。
查看地址:http://www.appgyver.eu/
Application Craft
一整套的跨平臺(tái)應(yīng)用開發(fā)解決方案,從設(shè)計(jì)到開發(fā),各種方便的IDE。不過是收費(fèi)的。
查看地址:https://www.applicationcraft.com/
ChocolateChip-UI
chocolatechip UI是一個(gè)開發(fā)移動(dòng)Web應(yīng)用程序框架。你只需要了解三種東西:語義化的HTML5標(biāo)簽、CSS和JavaScript。
查看地址:http://chocolatechip-ui.com/
DHTMLX Touch
同樣老牌的組件庫框架,從桌面端轉(zhuǎn)到移動(dòng)端,提供同樣可靠及豐富的組件。
查看地址:http://dhtmlx.com/docs/products/dhtmlxTouch/
Corona Labs
強(qiáng)大的跨平臺(tái)手機(jī)端框架之一,使用Lua腳本語言作為開發(fā)語言,有自己的2D的游戲引擎。主要適用于開發(fā)游戲。
查看地址:https://coronalabs.com/
Framework7
完美還原原生端組件的H5框架。
查看地址:http://www.idangero.us/framework7/
Gideros
Gideros是一個(gè)免費(fèi)的并且開源的框架,提供了跨平臺(tái)開發(fā)優(yōu)質(zhì)游戲的方式。你只需要幾個(gè)小時(shí)就可以構(gòu)建出你的偉大游戲。開發(fā)語言是Lua。
查看地址:http://giderosmobile.com/
未完待續(xù)。。。更多精彩實(shí)用的框架請(qǐng)看下集~
*請(qǐng)認(rèn)真填寫需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。