HTML5语义化结构标签有哪些?

<header>表示页面中一个内容区块或整个页面的标题。

<section>页面中的一个内容区块,如章节、页眉、页脚或页面的其他地方,可以和h1、h2……元素结合起来使用,表示文档结构。

<article>表示页面中一块与上下文不相关的独立内容,如一篇文章。

<aside>表示<article>标签内容之外的,与<article>标签内容相关的辅助信息。

<hgroup>表示对整个页面或页面中的一个内容区块的标题进行组合。

<figure>表示一段独立的流内容,一般表示文档主体流内容中的一个独立单元。

<figcaption>定义<figure>标签的标题。

<nav>表示页面中导航链接的部分。

<footer>表示整个页面或页面中一个内容区块的脚注。一般来说,它会包含创作者的姓名、创作日期及联系方式。

原文地址:https://www.cnblogs.com/mmit/p/11468766.html

时间: 2024-11-05 09:32:03

HTML5语义化结构标签有哪些?的相关文章

html5语义化标签使用规范

Html5添加了很多语义化标签,一个典型的html5页面结构可以如下安排 一.使用案例 1. 头部——header和nav标签 header头部,body下的直接子元素header一般用于放页面的介绍性的信息如网站名称.logo或者导航栏nav. <header> <h1>html5语义化标签</h1> <nav> <h1>导航</h1> <ul> <li>章节标签</li> <li>标

HTML5语义化标签

一.什么是语义化标签?1.那么什么叫做语义化呢?说的通俗点就是:就是给div起个外号,比如,网页上的文章的标题就可以叫他标题,网页上的各个文章,就可以叫他文章. 2.为啥使用语义化标签?(1). 更容易被搜索引擎收录.(2). 更容易让屏幕阅读器读出网页内容.(3). 能够更好的体现页面的主题.(4).兼容性更好,支持更多的网络设备.二.常见语义化标签 头部--header和nav标签 header头部,body下的直接子元素header一般用于放页面的介绍性的信息如网站名称.logo或者导航栏

HTML5的新语义化的标签

在HTML5之前采用HTML+CSS文档结构写法 Diagram illustrates a typical two-column layout marked up using divs with id and class attributes.It contains a header, footer, and horizontal navigation bar below the header. The main content contains an article and sidebar 

html5语义化标签——回顾

html5 头部结构   <!doctype html>    <meta charset=“utf-8”/> <header></header> 页眉 主要用于页面的头部的信息介绍,也可用于板块头部 <hgroup></hgroup> 页面上的一个标题组合 一个标题和一个子标题,或者标语的组合 <hgroup> <h1></h1> <h2></h2> </hgroup

说一说你对HTML5语义化的理解

本题地址:https://github.com/YvetteLau/Step-By-Step/issues/8 语义化意味着顾名思义,HTML5的语义化指的是合理使用语义化的标签来创建页面结构,如header,footer,nav,从标签上即可以直观的知道这个标签的作用,而不是滥用div. 语义化的优点有: 代码结构清晰,易于阅读,利于开发和维护 提高用于体验,在样式加载失败时,页面结构清晰 方便其他设备解析(如屏幕阅读器)根据语义渲染网页. 有利于搜索引擎优化(SEO),搜索引擎爬虫会根据不同

html5学习笔记(html5语义化)

Html5语义化:让机器可以读懂的内容,机器能读懂的就是标准了,就是新的这些个HTML5的标签了. 以前写html代码的时候呢 大多是DIV+CSS,这种div你可以拿他当头部当尾部当任何你需要表达含义的地方,正因为如此才让机器无法知道你这到底表达啥意思,于是语义化就有用了,给你一套标准,按这些规定的写,机器就能知道你表达的意思了. (语义网部分来源于:http://www.runoob.com/web/web-semantic.html) 而让机器读懂所需要的东西就是语义网.语义网技术,它包括

Html块标签、含样式的标签、语义化的标签:

Html块标签: (1)<div>标签 块元素,表示一块内容,没有具体的语义 (2)<span>标签 行内元素,表示一行中的一小段内容,没有具体的语义 <p>标签 默认是带空行的样式的 <div>标签 默认是不带空行的样式的 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <tit

新语义和结构标签

新语义或结构标签 arcicle 示例 <article> <h1>标题</h1> <p>征文内容</p></article> 标签定义及使用说明 定义独立内容 定义的内容本身必须是有意义的并且独立于文档的其余部分 潜在来源  论坛帖子 博客文章 新闻故事 评论 aside 示例 <p>My family and I visited The Epcot center this summer.</p> <a

好程序员web前端分享常见html5语义化标签

我们知道,创建结构清晰的页面可以建立良好的语义化基础,也降低了使用css的难度,下面总结了一些常用的语义化标签,有空慢慢更新,欢迎大家补充 语义化HTML:用最恰当的HTML元素标记的内容. 优点:1 提升可访问性:  2 S-EO:   3 结构清晰,利于维护: (HTML5旧的行内元素都被归类为短语内容) 通用容器:div——块级通用容器:span——短语内容无语义容器. 如果语义不合适,也不要霸王硬上弓,=.. =老实的用div吧. < title></title>:简短.描