您现在的位置：首页＞行业资讯

html5 文本相关标签（基础三）--中享思途

html5 文本相关标签

青岛HTML5培训--中享思途

一、标题 h1、h1、hgroup（标题组）
1、什么情况下使用标题？
01.标题是概括性的简短文字
02.标题能概括随后的内容
2、主标题与副标题
01.主标题
02.副标题
3、标题组 hgroup
01.当主标题和副标题成组时，应使用hgroup
hgroup h1
h2
4、标题级别问题
01.html5 里的标题级别是以层级来区分，越靠近body标签级别越高
5、Xhtml1.0 中的标题了解
01.html 5:
每个区块里的主标题均使用h1
每个区块里的副标题均使用h2
网页中通常拥有多个h1
02.Xhtml1.0:
按级别依次使用h1-h6
网页中有且仅有一个h1
Xhtml1.0与html 5中使用标题的区别
03.Xhtml1.0中的标题
单元一 1.<h2>单元一</h2>
第一章 2.<h3>第一章</h3>
第一节 3.<h4>第一节</h4>
第二节 4.<h4>第二节</h4>
第二章 5.<h3>第二章</h3>
第一节 6.<h4>第一节</h4>
第二节 7.<h4>第二节</h4>
单元二 8.<h2>单元二</h2>
小结：
01.在html5中主要使用两个标题的标签，主标题h1和副标题h2
02.当h1、h2 成组出现时要使用 hgroup 父对象。
03.标题不能随便用，标题要简短文字，要能概括随后的内容，导航条里的条目一般不会使用标题标签。
04.标题在 html5 里面级别极其依赖于结构本身的层级。
二、p 标签（paragraph 段落）
01.根据文章或事情的内容、阶段划分的相对独立的部分称之为：段落
02.示例：
<h1>第二节</h1>
<p>这里是段落文本，这里是段落文本</p><p>这里是第二段</p>
小结：
01.段落是文章的最常见的子元素。
02.段落会自动产生换行，并产生较大的上下空隙。
三、br 标签（分隔 break）
br 标签 --- 从中隔开 break(强制性换行)
四、span 小区域
01.<span> 被用来组合文档中的行级元素。
02.什么是行级元素？
它也称为行内元素，内嵌元素。等级元素在一行内水平排列，不会主动产生换行，除非遇到了宽度的限制。
03.示例：
今天体育课迟到的人有<span class= "boy">张三</span>，<span class= "boy">李四</span>和<span class= "girl">王五</span>，最后还有<span class= "girl">小六</span>。
添加css 修饰：
<style type="text/css">
.boy{
background: #f90;
}
.girl{
background: #0f9;
}
</style>
04.class 属性 --- 类，类别
在刚才的示例中，创建了两条css规则，每条规则都针对了同一类的对象作了统一的修饰。
小结：
01.span用来划分小区域。
02.不会主动引起换行（属于行级元素）
03.常常与结合class属性使用
五、引用标签 blockquote、q、cite
blockquote 标签 --- 旧有标签，长的引用
q 标签 --- 短引用
cite 标签 --- 参考文献引用
代码示例：
1、<blockquote cite="http://www.baidu.com">
<p>这是一段很长的引用，这是一段很长的引用，
这是一段很长的引用，这是一段很长的引用，</p></blockquote>
2.摘自<cite>《书名》</cite>
3.就像说的，<q>这是一个短引用</q>。
cite 属性 --- 表示引用的来源
01.主流浏览器均不支持 cite 属性。不过搜索引擎可能会使用该属性获得更多有关引用的信息。
小结：
01.长引用使用 blockquote 标签
02.短引用使用 q 标签
03.参考文献标题引用使用 cite 标签
六、mark 标签
01.mark 标签作为一个冷门标签，有一些兼容性问题。
小结：mark 标注那些不重要、但在特定情况下需要标注的文字。