前端项目中遇到的问题及解决办法

核心提示一、不要使用section作为p的替代品人们在标签使用中最常见到的错误之一就是随意将HTML5的等价于——具体地说,就是直接用作替代品。在XHTML或者HTML4中,我们常看到这样的代码: My super duper page Head

一、不要用section代替p,人们在使用标签时最容易犯的一个错误就是武断地把HTML5等同于——具体来说,直接用它来代替。在XHTML或HTML4中,我们经常会看到这样的代码:我的超级页面标题内容

页面内容

次要内容

页脚内容

而现在在HTML5中,会是这样的:请不要复制这些代码!这是不对的!我的超级骗子页面

这不是正确的用法:

不是样式容器。*section元素表示用于帮助构建文档大纲的内容的语义部分。它应该包含一个标题。如果你想找到一个用作页面容器的元素,考虑像Kroc Camen说的那样直接在body元素上写样式。如果还需要额外的样式容器,最好继续用p,基于以上思路,下面是一个正确使用HTML5和一些ARIA roles特性的例子:我的超级duper页面

如果你还是无法确定使用哪种元素,那么我建议你参考HTML5 sectioning content element flowchart二、只在需要的时候使用header和hgroup*写不需要写的标签当然是毫无意义的。不幸的是,我经常看到header和hgroup被无意义的滥用。你可以阅读一下关于header和hgroup元素的两篇文章做一个详细的了解,其中内容我简单总结如下:- header元素表示的是一组介绍性或者导航性质的辅助文字,经常用作section的头部- 当头部有多层结构时,比如有子头部,副标题,各种标识文字等,使用hgroup将h1-h6元素组合起来作为section的头部header的滥用由于header可以在一个文档中使用多次,可能使得这样代码风格受到欢迎:请不要复制这段代码!此处并不需要header –>

我最好的博客文章如果你的头元素只包含一个头元素,丢弃头元素。既然article元素已经保证了表头会出现在文档摘要中,而且表头不能包含多个元素,为什么还要写多余的代码呢?简单地这样写:我最好的博客帖子

“headers”的错用在主语上,我经常看到hgroup的错用。有时候你不应该同时使用hgroup和header:-如果只有一个子header如果hgroup自己能很好的工作。。。不要胡说八道。第一个问题一般是这样的:请不要复制这段代码!这里不需要h组->

里奇·克拉克写的我最好的博客

此例中,直接拿掉hgroup,让heading果奔吧。 My best blog post

里奇·克拉克

第二个问题是另一个不必要的例子:请不要复制这段代码!此处不需要header –>

公司成立1893如果表头的唯一子元素是hgroup,表头的用途是什么?如果头中没有其他元素,只需移除头。我的公司大约成立于1893年

更多的例子和解释,请参阅

 
友情链接
鄂ICP备19019357号-22