首页 > 代码库 > HTML5基本布局
HTML5基本布局
HTML4布局
HTML5布局
基本的HTML5文档的模式为:
<!DOCTYPE html><html lang = "en"><head><meta charset = "utf-8"><title>HTML5 Demo</title><body><header><h1></h1><h2></h2></header><nav><ul><li></li><li></li></ul></nav><section><article></article><article></article></section><aside></aside><footer></footer></body></html>
推荐一个HTML5模板的在线编辑器
http://jsbin.com/#javascript,html
经常在项目中会用到reset的样式,在这里罗列出来参考下:
HTML5 Reset Stylesheet
/* html5doctor.com Reset Stylesheetv1.6.1Last Updated: 2010-09-17Author: Richard Clark - http://richclarkdesign.com Twitter: @rich_clark*/html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}body { line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block;}nav ul { list-style:none;}blockquote, q { quotes:none;}blockquote:before, blockquote:after,q:before, q:after { content:‘‘; content:none;}a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}/* change colours to suit your needs */ins { background-color:#ff9; color:#000; text-decoration:none;}/* change colours to suit your needs */mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}del { text-decoration: line-through;}abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help;}table { border-collapse:collapse; border-spacing:0;}/* change border colour to suit your needs */hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}input, select { vertical-align:middle;}
参照:http://html5doctor.com/html-5-reset-stylesheet/
HTML5基本布局
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。