语义化标签
为什么要语义化
- 代码结构:在没有css的情况下也能呈现出很好的内容
- 有利于SEO:可以和搜索引擎建立良好的沟通
- 便于团队开发和维护:语义化代码更具有可读性
h1~h6
定页面标题 h1元素具有最高等级
<h1>大标h1</h1>
<section>
<h2>标题h2</h2>
<h3>标题h3</h3>
<h4>标题h4</h4>
<h5>标题h5</h5>
<h6>标题h6</h6>
</section>
header
通常包括 logo ,主导航 ,全站链接 ,搜索框
<header>
<h1>标题</h1>
<nav>
<a href="#">链接</a>
<a href="#">链接</a>
<a href="#">链接</a>
</nav>
</header>
nav
定义页面导航链接部分区域
<nav>
<a href="#">链接</a>
<a href="#">链接</a>
<a href="#">链接</a>
</nav>
main
定义页面主要内容,一个页面只能用一次,web应用主要包括其重要功能
<main>
<h2>如果当时</h2>
<p>红雨瓢泼泛起了回忆怎么潜</p>
</main>
article
定义页面独立的内容,它可以有自己的header nav section
- 论坛文章
- 博客文章
- 新闻故事
- 评论
<article>
<h2>如果当时</h2>
<p>红雨瓢泼泛起了回忆怎么潜</p>
</article>
section
定义页面的某个区域
<section>
<h2>如果当时</h2>
<p>红雨瓢泼泛起了回忆怎么潜</p>
</section>
aside
用于显示与内容相关的内容块 通常显示侧边栏
<aside>
<h2>如果当时</h2>
<p>红雨瓢泼泛起了回忆怎么潜</p>
</aside>
footer
定义页面的底部
<footer>
copy
</footer>
small
不重要的小字体内容
strong
定义语气较强的内容
blockquote
从常规文本中脱离出来 在元素前后加了换行 并增加外边距
abbr
解释缩写单词 title属性可提供全称
<abbr title="告诉你!赶紧登录游戏">上号</abbr>
标签:定义,标签,红雨,标题,语义,瓢泼,链接,页面 来源: https://www.cnblogs.com/rain-sparse/p/yyh.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。