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
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
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:
- <!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>
<!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.
现在真怕看代码，呵呵