你正在寻找一个快速建站的方法吗?那么,你就来对了地方。我们收集了50+个响应式的HTML5 模版,你只需要根据你的项目进行一些小小的调整,你就可以拥有自己的网站。最棒的是它们都是免费的。

一个现成的模版是建立企业站的很好的选择。有许多现成的专业设计的模版可以选择,然而它们往往需要一定程度的定制。最终你会发现你需要修改代码来实现。如果你有一些 HTML 和 CSS 基础的话那还好说,但是对于一点代码都不懂的用户呢?

本文收集的模版都来源于一些可信任的网站,它们都很符合最新的网页设计趋势。另外,它们还有一些很酷的效果,如:视差滚动,巨型菜单,响应式设计等等。

## 1. [Landed][0]

如果你需要一个较新的、功能丰富的网站,Landed是一个不错的选择。它在首页有个全屏的大图,采用延迟加载和视差效果。

![html5_template_01][1]

## 2. [Colossus][2]

该模版提供了一个简洁的响应式功能来吸引更多的访客,它可以根据任何屏幕的分辨率来调整网页的大小,无论是PC端还是平板端。

![html5_template_02][3]

## 3. [Cafe and Restaurant][4]

这是一个专门为咖啡馆和餐厅设计的响应式 HTML5 模版。使用了全屏滑块,懒加载,视差和悬停效果。

![html5_template_03][5]

## 4. [Flex][6]

这个单页模版非常适合在线简历。

![html5_template_04][7]

## 5. [Alpha][8]

另一个简洁布局的模版,非常适合企业站。

![html5_template_05][9]

## 6. [Viral][10]

该模版布局简洁,顶部使用全屏宽的图像,巨型菜单和按钮悬停效果。

![html5_template_06][11]

## 7. [Design Agency][12]

使用这款模版可以给你的品牌一个全新的面貌。它符合最新的网站设计标准,简洁的布局、视差滚动、全屏宽谷歌地图等。

![html5_template_07][13]

## 8. [Ion][14]

需要一个功能强大的博客模版?Ion 是一个非常好的选择。它提供了一个简洁的布局,主页顶部使用全屏宽图像和固定菜单。

![html5_template_08][15]

## 9. [Extant][16]

这个简洁的响应式 HTML5 模版非常适合博客和在线教育网站。

![html5_template_09][17]

## 10. [Modi][18]

这个模版有很多炫酷的功能。全屏滑块、固定的巨型菜单、图像悬停和视差效果。

![html5_template_10][19]

## 11. [Abele][20]

响应式设计、巨型菜单。非常适合新闻类和教育类博客。

![html5_template_11][21]

## 12. [Transit][22]

使用此模板来给你的网站一个全新的外观和风格,以及无与伦比的功能。

![html5_template_12][23]

## 13. [Volton][24]

单页面网站、左边栏垂直菜单确保了很好的用户体验。

![html5_template_13][25]

## 14. [Corporate][26]

全宽度滑块,固定的巨型菜单,视差,悬停和延迟加载效果。

![html5_template_14][27]

## 15. [Photon][28]

单页面 HTML5 模版,视察效果及鼠标悬停效果。

![html5_template_15][29]

## 16. [Horizons][30]

布局非常简洁的模版,适用于企业和新闻类博客。

![html5_template_16][31]

## 17. [Masonry][32]

![html5_template_17][33]

## 18. [Lawyers Bureau][34]

响应式布局,适用于任何类型的屏幕。

![html5_template_18][35]

## 19. [Highlights][36]

适用于在线简历的单页面模版,全屏滑块和响应式设计

![html5_template_19][37]

## 20. [Linear][38]

如果你需要一个既保守又现代的模版,这是一个很好的选择。图像视差效果和响应式布局。

![html5_template_20][39]

## 21. [Thomsoon Responsive Portfolio Template][40]

![freebies_for_designers_36][41]

## 22. [Gentelella Bootstrap Admin Template][42]

![freebies_for_designers_39][43]

## 23. [Game of Thrones Responsive Template][44]

![free_resources_for_designers_april_2015_36][45]

## 24. [White One-Pager][46]

![freebies_march_31][47]

## 25. [Forkio One-Pager][48]

![freebies_march_32][49]

## 26. [Tessellate][50]

![html_css_web_mobile_responsive_templates-01][51]

## 27. [Pichichi][52]

![html_css_web_mobile_responsive_templates-04][53]

## 28. [My Kingdom][54]

![html_css_web_mobile_responsive_templates-05][55]

## 29. [Piccolo][56]

![html_css_web_mobile_responsive_templates-06][57]

## 30. [Harbour][58]

![html_css_web_mobile_responsive_templates-07][59]

## 31. [SB Admin 2][60]

![html_css_web_mobile_responsive_templates-08][61]

## 32. [Treviso][62]

![html_css_web_mobile_responsive_templates-09][63]

## 33. [Overflow][64]

![html_css_web_mobile_responsive_templates-10][65]

## 34. [Start][66]

![html_css_web_mobile_responsive_templates-11][67]

## 35. [StockDocs][68]

![html_css_web_mobile_responsive_templates-12][69]

## 36. [TemplateVamp][70]

![html_css_web_mobile_responsive_templates-13][71]

## 37. [Big Picture][72]

![html_css_web_mobile_responsive_templates-14][73]

## 38. [Freebix][74]

![html_css_web_mobile_responsive_templates-15][75]

## 39. [Singolo][76]

![html_css_web_mobile_responsive_templates-17][77]

## 40. [Picku][78]

![html_css_web_mobile_responsive_templates-19][79]

## 41. [Juntos][80]

![html_css_web_mobile_responsive_templates-21][81]

## 42. [Prologue][82]

![html_css_web_mobile_responsive_templates-22][83]

## 43. [Caprice][84]

![html_css_web_mobile_responsive_templates-23][85]

## 44. [Landing Page][86]

![html_css_web_mobile_responsive_templates-24][87]

## 45. [Mamba][88]

![html_css_web_mobile_responsive_templates-25][89]

## 46. [Landy][90]

![html_css_web_mobile_responsive_templates-27][91]

## 47. [Brushed Template][92]

![responsive_html_03][93]

## 48. [Escape Velocity][94]

![responsive_html_04][95]

## 49. [Serendipity][96]

![responsive_html_10][97]

## 50. [Varna Template][98]

![responsive_html_11][99]

## 51. [mnml Lightweight Template][100]

![responsive_html_13][101]

## 52. [Agency][102]

![responsive_html_14][103]

## 53. [Century][104]

![responsive_html_16][105]

## 54. [Responsive Wedding][106]

![responsive_html_17][107]

via:[speckyboy][108] ,本文由 [Specs][109] 翻译整理,发布在 [Coder资源网][110],转载请注明来源。

发布于 [2015年6月17日][111]作者 [Specs][112]分类 [Web前端][113]标签 [HTML5][114]、[响应式][115]、[模版][116]

4

[0]: http://html5up.net/landed
[1]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_01.jpg
[2]: http://www.os-templates.com/free-website-templates/colossus
[3]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_02.jpg
[4]: http://www.templatemonster.com/cafe-restaurant-free-website-template.html
[5]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_03.jpg
[6]: http://www.templatemo.com/preview/templatemo_406_flex
[7]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_04.jpg
[8]: http://www.templatemo.com/live/templatemo_406_flex
[9]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_05.jpg
[10]: http://www.os-templates.com/free-website-templates/viral
[11]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_06.jpg
[12]: http://www.templatemonster.com/free-responsive-design-agency-template.html
[13]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_07.jpg
[14]: http://templated.co/ion
[15]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_08.jpg
[16]: http://html5layouts.com/extant/
[17]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_09.jpg
[18]: http://www.templatemonster.com/free-cherry-wordpress-theme.html
[19]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_10.jpg
[20]: http://www.os-templates.com/free-website-templates/abele
[21]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_11.jpg
[22]: http://templated.co/transit
[23]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_12.jpg
[24]: http://www.templatemo.com/preview/templatemo_441_volton
[25]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_13.jpg
[26]: http://www.templatemonster.com/free-responsive-corporate-template.html
[27]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_14.jpg
[28]: http://html5up.net/photon
[29]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_15.jpg
[30]: http://templated.co/horizons
[31]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_16.jpg
[32]: http://www.templatemo.com/live/templatemo_434_masonry
[33]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_17.jpg
[34]: http://www.templatemonster.com/free-responsive-javascript-animated-template.html
[35]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_18.jpg
[36]: http://html5up.net/highlights
[37]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_19.jpg
[38]: http://templated.co/linear
[39]: http://i.9iphp.com/wp-content/uploads/2015/06/html5_template_20.jpg
[40]: http://thomsoon.com/thomsoon/demo/
[41]: http://i.9iphp.com/wp-content/uploads/2015/06/freebies_for_designers_36.png
[42]: https://github.com/kimlabs/gentelella
[43]: http://i.9iphp.com/wp-content/uploads/2015/06/freebies_for_designers_39.png
[44]: https://dribbble.com/shots/2021038-Game-of-Thrones-Redesign-and-Free-Responsive-HTML-Template
[45]: http://i.9iphp.com/wp-content/uploads/2015/06/free_resources_for_designers_april_2015_36.png
[46]: http://pixelbuddha.net/freebie/freebie-white-one-page-html-template
[47]: http://i.9iphp.com/wp-content/uploads/2015/06/freebies_march_31.png
[48]: http://pixelbuddha.net/freebie/freebie-forkio-one-page-html-template
[49]: http://i.9iphp.com/wp-content/uploads/2015/06/freebies_march_32.png
[50]: http://html5up.net/tessellate
[51]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-01.jpg
[52]: http://dribbble.com/shots/1192183-Pichichi-Freebie-html5-responsive-template
[53]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-04.jpg
[54]: http://w3layouts.com/kingdom-minimalistic-flat-corporate-responsive-web-template
[55]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-05.jpg
[56]: http://wegraphics.net/downloads/piccolo-a-free-bootstrap-html-theme/
[57]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-06.jpg
[58]: http://w3layouts.com/harbour-flat-portfolio-responsive-web-template
[59]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-07.jpg
[60]: http://startbootstrap.com/sb-admin-v2
[61]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-08.jpg
[62]: http://blog.ninetofive.me/psd-freebies/treviso-a-free-html-template/
[63]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-09.jpg
[64]: http://html5up.net/overflow
[65]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-10.jpg
[66]: http://startbootstrap.com/grayscale
[67]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-11.jpg
[68]: http://www.egrappler.com/free-product-documentation-html-template/
[69]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-12.jpg
[70]: http://www.egrappler.com/templatevamp-free-twitter-bootstrap-admin-template/
[71]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-13.jpg
[72]: http://html5up.net/big-picture
[73]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-14.jpg
[74]: http://www.anarieldesign.com/free-responsive-html-template/
[75]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-15.jpg
[76]: http://www.psdchat.com/resources/freebie-flat-single-page-website/
[77]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-17.jpg
[78]: https://www.behance.net/gallery/Picku-Free-HTML-Template/14451657
[79]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-19.jpg
[80]: http://2f-design.fr/juntos/
[81]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-21.jpg
[82]: http://html5up.net/prologue
[83]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-22.jpg
[84]: http://elemisfreebies.com/07/19/caprice-free-html-template/
[85]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-23.jpg
[86]: http://startbootstrap.com/landing-page
[87]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-24.jpg
[88]: http://bootstraptaste.com/mamba-one-page-bootstrap-template-free/
[89]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-25.jpg
[90]: https://github.com/paolotripodi/Landy-v1.0/
[91]: http://i.9iphp.com/wp-content/uploads/2015/06/html_css_web_mobile_responsive_templates-27.jpg
[92]: http://www.alessioatzeni.com/blog/brushed-template/
[93]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_03.jpg
[94]: http://html5up.net/escape-velocity/
[95]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_04.jpg
[96]: http://elemisfreebies.com/09/03/serendipity-free-html-template/
[97]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_10.jpg
[98]: http://dribbble.com/shots/1089837-Varna-Template-Free
[99]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_11.jpg
[100]: http://mn-ml.cc/
[101]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_13.jpg
[102]: http://www.egrappler.com/responsive-business-portfolio-template-built-using-twitter-bootstrap-agency/
[103]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_14.jpg
[104]: https://github.com/GithubProfile/century
[105]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_16.jpg
[106]: https://github.com/bmgdev/responsive-wedding
[107]: http://i.9iphp.com/wp-content/uploads/2015/06/responsive_html_17.jpg
[108]: http://speckyboy.com/2015/03/26/20-free-html5-web-templates/
[109]: http://9iphp.com/
[110]: http://info.9iphp.com/
[111]: http://info.9iphp.com/50-free-html5-web-templates/
[112]: http://info.9iphp.com/author/specs/
[113]: http://info.9iphp.com/category/web/
[114]: http://info.9iphp.com/tag/html5/
[115]: http://info.9iphp.com/tag/%25e5%2593%258d%25e5%25ba%2594%25e5%25bc%258f/
[116]: http://info.9iphp.com/tag/template/