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
記得去年底找到一個很棒的HTML5網站模版下載網站Templated,真的是網站開發者的好朋友,至少我們不用從無到有、從頭到尾來打造一個網站,而是直接就現有的樣版去做修改或調整,讓建網站難度降低許多,也減少花費的時間和開支。
之前網友推薦我一個名為HTML5 UP!的網頁設計下載網站,提供大量HTML5模版,而且這些模版都支持響應式網頁設計(Responsive Web Design,簡稱RWD),也是俗稱的「自適應網頁設計」,通過自動彈性調整畫面設計,以改變布局方式來使不同大小屏幕皆能正常瀏覽,達到最好的使用體驗。
因為自適應網頁設計在開發上較為繁瑣,一般很少免費提供下載的網站,但HTML5 UP!收錄一系列共28種網頁設計,通通都是HTML5+CSS3并有響應式設計功能,網站采用的授權方式為Creative Commons姓名標示3.0,也就是說你可以自由分享、修改這些模版,唯獨需要保留網頁里的姓名標示(Attribution)。
如果你喜歡這位設計師的作品,那可在Pixelarity網站找到更多模版下載,不過這網站是采用訂閱計費方式,最便宜方案為每三個月美元,可自由下載所有的網頁設計。
站點名稱:HTML5 UP!
網站連接:http://html5up.net/
使用教學
STEP 1
HTML5 UP!網站提供的模版都具有一定的質量,使用的圖片大多為免費圖庫而來,采用的是CC0授權,一般來說要放在網頁上、或者置換掉都沒有問題。從網頁里可以點選任何一個設計的Live Demo進行即時預覽,或者Free Download免費下載。
STEP 2
HTML5 UP!的即時預覽(Live Demo)功能蠻好用的,除了可以讓你即時操作網頁、查看整體效果外,從左上角還能切換不同大小屏幕裝置,例如桌面、平板電腦、手機,就能即時看到「響應式網頁設計」效果。
這是其中一個模版Strata在桌面瀏覽器的呈現效果:
切換到平板電腦時,屏幕寬度雖然縮小,但可以發現網頁設計沒有太大變化。
一旦切換到手機大小,網頁就自動縮成一行,不過依然保持原有的設計,并且能夠正常顯示網頁上的內容,這就是自適應網頁設計的特色。在HTML5 UP!里提供的樣版皆支持自適應設計,喜歡的話點選右上角的Download即可免費下載!
STEP 3
下載時不用注冊、也無需登錄任何數據,可以的話,記得順手幫HTML5 UP!按個贊,或是加入追蹤,讓這個網站可以被更多人看到。
----我是分割線------
致力發布和推廣來自世界各地的互聯網資源
希望與更多人分享網絡快樂與便利,點關注作者更精彩!
關注"荒料" 每天為您推薦優秀的國內外模版,源代碼,最新的技術。
[預覽地址]:https://purecss.io/base/
[下載地址]:https://github.com/yahoo/pure/
*請認真填寫需求信息,我們會在24小時內與您取得聯系。