第八十七节,html5+css3pc端固定布局,大纲算法,section和div,结构分析


html5+css3pc端固定布局,大纲算法,section和div,结构分析

一.大纲算法
在HTML5中有一个很重要的概念,叫做HTML5 大纲算法(HTML5Outliner),它的用途是为用户提供一份页面的信息结构目录。比如我们经常使用的手册就是一个非常好的大纲结构:

测试工具:https://gsnedders.html5.org/outliner/
这个工具可以上传本地html文件,也可以填写URL,或者直接在多行文本框上编写HTML5代码均可了解大纲。
通过我们将上一节课的代码编写,发现这个页面的大纲非常的难看,出现三个Untitled Section,这个意思表示页面此处缺少大纲标题,不规范。如果你的页面在这里测试,大纲都比较清晰,那么HTML5页面是比较规范的。

需要大纲的标签

1.,是需要大纲标题的,注意:里面的大纲标题的上级,如果是需要大纲标题的,大纲标题就归属于上级,如果上级是不需要大纲标题的,大纲标题就归属于标签

语义标签一般就是拿来布局大纲,最好不要用于css样式,css样式用div,

语义标签说明

         网页主体                         需要大纲

          表示首部                                                             不需要要大纲             用于头部区域

           表示尾部                                                       不需要要大纲             用于尾部区域