你必须知道的28个HTML5特征、窍门与技术.docVIP

HYPERLINK /author/jeffreyway/ Jeffrey Way曾发表过一篇博文《 HYPERLINK /tutorials/html-css-techniques/25-html5-features-tips-and-techniques-you-must-know/ 28 HTML5 Features, Tips, and Techniques you Must Know?》讲述了28个HTML5特征、窍门和技术， HYPERLINK /wordpress/ 张鑫旭将本文进行了 HYPERLINK /wordpress/?p=1058 翻译，现转载于此，全文如下：前端的发展如此之迅猛，一不留神，大侠你可能就会被远远地甩在后面了。如果你不想被HTML5的改变/更新搅得不知所措的话，可以把本文的内容作为必须了解的热身课程。一、新的Doctype（译者注：“doctype”中文意思指“文档类型”）仍在使用麻烦的，不可能记得住的XHTML文档类型？!DOCTYPE?html?PUBLIC?-//W3C//DTD?XHTML?1.0?Transitional//EN??/TR/xhtml1/DTD/xhtml1-transitional.dtd?如果是，为什么还在用呢？使用新的HTML5文档类型代替吧。你会活得更久的——正如Douglas Quaid说的!DOCTYPE?html?我就琢磨着，为了HTML5搞个这厮代码，您可能会对这段代码究竟靠不靠谱表示怀疑。不用担心，如今这是可行的，只有老的浏览器需要一个特定的doctype（文档类型）。浏览器如果不知道doctype，就会很简单的以标准模式对包含的标签进行渲染。所以，妹妹你大胆的向前冲，把小心谨慎都抛到九霄云外，去拥抱新的HTML5文档类型吧。二、图形元素(The Figure Element )看看下面给图片添加的标示：img?src=path/to/image?alt=About?image?/?pImage?of?Mars.?/p??文字裹在p标签里，与img标签各行其道，很难让人联想到这就是标题。HTML5通过采用figure元素对此进行了改正。当合figcaption元素组合使用时，我们就可以语义化地联想到这就是图片相对应的标题figure?????img?src=path/to/image?alt=About?image?/?????figcaption?????????pThis?is?an?image?of?something?interesting.?/p?????/figcaption?/figure?三、small重新定义还在不久前，small元素被用来创建靠近logo且相关的副标题。这是个很有用的表现元素，但是，现在，这种用法可能就不正确了。small元素已经被重新定义了，指小字，因而更具可用性。试想下你网站底部的版权状态，根据对此元素新的HTML5定义，small可以正确地包裹这些信息。small元素专指“小字”。四、脚本(scripts)和链接(links)无需type您可能现在仍在给link和script标签增加type属性。link?rel=stylesheet?href=path/to/stylesheet.css?type=text/css?/?script?type=text/javascript?src=path/to/script.js/script?这已经是老黄花菜，非必需品了。这意味着，这些标签都各自指向样式表和脚本。因此，我们可以把type属性一起干掉。link?rel=stylesheet?href=path/to/stylesheet.css?/?script?src=path/to/script.js/script?五、引号还是不要引号…这确实是个问题。记住，HTML5不是XHTML，要是你不愿意，你没有必要非得用引号标记包裹你的属性，没有必要非得闭合元素。换句话说，只要你自己觉得舒服，就没有什么对错之分。对于我自己来说就是如此。p?class=myClass?id=someId?Start?the?reactor.?对此取舍你还得自己拿主意。如果你更倾向于结构化的文档，就算天塌下来，也要把引号牢牢拽在怀里。六、内容可编辑最新的浏览器有个很赞的新属性可以应用到元素上，叫做contenteditable。顾名思意，就是允许用户编辑元素内容包含的任意文本，包括子元素。类似的用途还有很多，像是简单的待办事项清单应用程序，可大大利用其本地存储的优势。ul?contenteditable=true?????li悼念遇难香港同胞?/li?????li深圳特区30周年/li?????li伊春空难/li?/ul?或者，根据