12款免费的优秀高质量 HTML5+CSS3 模板

HTML5是下一代主要的HTML编码规范,HTML5为网页设计者们提供了一些强大的新功能,HTML5的新功能包括:表单控制、APIS、拖拽、多媒体、屏幕绘图等。本文向大家推荐12款免费的优秀高质量 HTML5+CSS3 模板。

1. Touch The Future: Create An Elegant Website With HTML 5 And CSS3

The aim of this tutorial is to create an elegant blog/portfolio for an efficient professional (graphic and web designer or photographer). You will can download the template at the end of the tutorial.

2. Free 2 Column & 3Column HTML5 template

2 column layout and another 3 column with a little contact box, .psd file is included with each template.

3. One-Page Website Template

An HTML5 web template, using some of the new features brought by CSS3 and jQuery, with the scrollTo plug-in.

4. EarthDay HTML5 and CSS3 Template

EarthDay is a 3-column HTML5 and CSS3 template designed to honor Earth Day. Sporting the blues and greens we’ve come to expect from eco-friendly sites, the template should work well for any green inspired content.

5. Coding A HTML 5 Layout From Scratch

Coding A HTML 5 Layout From Scratch

A very basic layout which covers most of the elements we can start coding using HTML5. Basically: the page’s name and it’s slogan, a menu, a highlighted (featured) area, a post listing, an extras section with some external links, an about box and finally a copyright statement.

6. FlipThru HTML5 and CSS3 Template

FlipThru is a 1-column business-oriented HTML5 and CSS3 template that makes extensive use of CSS3 to create a horizontal accordion effect. This effect does work in IE as well.

7. HTML 5 and CSS 3: The Techniques You’ll Soon Be Using

HTML 5 and CSS 3: The Techniques You’ll Soon Be Using

In this tutorial, we are going to learn how to build a blog page using next-generation techniques from HTML 5 and CSS 3. Pretty much your every day blog design. Header with title, horizontal navigation, content area with comments and form, sidebar and a footer.

Take a look at the markup:

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <title>Page title</title>
  5. </head>
  6. <body>
  7. <header>
  8. <h1>Page title</h1>
  9. </header>
  10. <nav>
  11. <!– Navigation –>
  12. </nav>
  13. <section id=”intro”>
  14. <!– Introduction –>
  15. </section>
  16. <section>
  17. <!– Main content area –>
  18. </section>
  19. <aside>
  20. <!– Sidebar –>
  21. </aside>
  22. <footer>
  23. <!– Footer –>
  24. </footer>
  25. </body>
  26. </html>
<!doctype html>
<html>
<head>
	<title>Page title</title>
</head>
<body>
	<header>
		<h1>Page title</h1>
	</header>
	<nav>
		<!-- Navigation -->
	</nav>
	<section id="intro">
		<!-- Introduction -->
	</section>
	<section>
		<!-- Main content area -->
	</section>
	<aside>
		<!-- Sidebar -->
	</aside>
	<footer>
		<!-- Footer -->
	</footer>

</body>
</html>

8. Simple Website Layout Tutorial

A very Simple web page with HTML 5 and styling with CSS3.

9. Gotta’ love HTML5 & CSS3

A tabbed image gallery but animated using some CSS transitions. All of this is going to be built with HTML5 & CSS3, there is going to be NO use of flash or javascript for this layout.

10. HTML5 CSS3 starting template

It’s always useful to have a base to start a new website build from and what better way to encourage people to use HTML5 and CSS3 than sharing my basic HTML5/CSS3 template.

11. H5 WordPress Theme Template

The H5 Theme Template provides everything you need to create beautiful themes with HTML 5 right now. H5 contains a complete set of theme files and folders, and each file has been meticulously crafted with all of the latest and greatest WordPress functionality.

12. A free HTML5 and CSS3 theme

A truly HTML5 and CSS3 elegant theme with a Fully working Ajax PHP contact form, Uses the ChunkFive font to headings and IE6 & IE7 warning.

思章老师

认准了方向,就要勇敢地走下去,十年磨一剑,我相信,只要坚持,一切都有可能。

相关日志

  1. 没有图片

    2009.07.05

    WordPress 2.8 浏览统计插件 WP-PostViews 下载+设置教程

    浏览统计插件WP-PostViews下载地址…

  2. 没有图片

    2012.05.20

    Centos 服务器时间同步

    新装的服务器可能设置了错误的,需要调整时区并…

  3. 没有图片

    2010.02.20

    网页配色表 设计者必备

    网页设计的时候需要各种颜色,都靠自己想象肯定…

  4. 没有图片

    2009.10.15

    WordPress 2.9 已经进行测试阶段

    登陆Wordpress 2.84后台,就会看…

  5. 没有图片

    2009.07.26

    10 个提供 Twitter 热门话题服务的网站

    Twitter 上每天都会更新很多的信息,我…

  6. 没有图片

    2010.07.05

    火狐Firefox书签同步工具 — Firefox Sync

    怪兽实验室之前有一个项目叫做“Weave S…

评论

  1. 花脸猴 2011.03.23 10:45上午

    现在真怕看代码,呵呵