资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

网页布局结构分析

H5新增的常用结构性元素

平阴网站制作公司哪家好,找创新互联!从网页设计、网站建设、微信开发、APP开发、响应式网站建设等网站项目制作,到程序开发,运营维护。创新互联于2013年创立到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联

section

标签定义了文档的某个区域。比如章节、头部、底部或者文档的其他区域

article

标签定义独立的内容

标签定义的内容本身必须是有意义的且必须是独立于文档的其余部分

nav

标签定义导航链接的部分

并不是所有的 HTML 文档都要使用到

aside

hgroup

标签被用来对标题元素进行分组。

当标题有多个层级(副标题)时,

元素被用来对一系列 

 -  元素进行分组

footer

标签定义文档或者文档的一部分区域的页脚。

元素应该包含它所包含的元素的信息。

在典型情况下,该元素会包含文档创作者的姓名、文档的版权信息、使用条款的链接、联系信息等等。

在一个文档中,您可以定义多个

元素

header

标签定义文档或者文档的一部分区域的页眉。

元素应该作为介绍内容或者导航链接栏的容器。

在一个文档中,您可以定义多个

元素。

注释:

标签不能被放在
或者另一个
元素内部

figure

标签规定独立的流内容(图像、图表、照片、代码等等)。

元素的内容应该与主内容相关,同时元素的位置相对于主内容是独立的。如果被删除,则不应对文档流产生影响

H5新增的常用语义性元素

mark

标签定义带有记号的文本。

请在需要突出显示文本时使用 标签

progress

标签定义运行中的任务进度(进程)

time

该元素能够以机器可读的方式对日期和时间进行编码,这样,举例说,用户代理能够把生日提醒或排定的事件添加到用户日程表中,搜索引擎也能够生成更智能的搜索结果

details

标签规定了用户可见的或者隐藏的需求的补充细节。

标签用来供用户开启关闭的交互式控件。任何形式的内容都能被放在
标签里边。

元素的内容对用户是不可见的,除非设置了 open 属性

datalist

标签规定了 元素可能的选项列表。

标签被用来在为 元素提供"自动完成"的特性。用户能看到一个下拉列表,里边的选项是预先定义好的,将作为用户的输入数据。

请使用 元素的 list 属性来绑定 元素

ruby

标签定义 ruby 注释(中文注音或字符)。

在东亚使用,显示的是东亚字符的发音。

标签与  和  标签一起使用: 
元素由一个或多个需要解释/发音的字符和一个提供该信息的 元素组成,还包括可选的 元素,定义当浏览器不支持 "ruby" 元素时显示的内容

menu

标签定义了一个命令列表或菜单。

标签通常用于文本菜单,工具条和命令列表选项

tip:目前主流浏览器并不支持

标签

command

标签可以定义用户可能调用的命令(比如单选按钮、复选框或按钮)。

当使用

元素时,command 元素将作为菜单或者工具栏的一部分显示出来。但是,用 command 规定键盘快捷键时,command元素能被放置在页面的任何位置,但元素不可见

tip:主流浏览器都不支持 标签

布局结构样例

临摹样例:

网页布局结构分析

思路:

网页布局结构分析

    

样例代码,此代码不能真实运行,意在表达出页面结构

Structure导航1导航2导航3导航4导航5Lasted News内容1内容2内容3About your site第一段内容第二段内容About your team哈哈哈哈WebSite template

网站标题:网页布局结构分析
转载来于:http://cdkjz.cn/article/ipgies.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220