HTML5 文本标记
文本标记概述
文本标记的作用
文本是网页上的重要组成部分,直接书写的文本会用浏览器默认的样式显示,包含在标记中的文本则会被显示为标记所拥有的样式:
- 特殊字符
- 注释
- 标题元素
- 段落元素
- 换行元素
- 分区元素
- ...
文本与特殊字符
在网页中输入多个空格或制表符会被压缩成单个空格,即只显示一个空格。特殊字符(如空格),需要进行转义才能正常显示(字符实体)。
- :一个空格
- > : > greater than
- < : < less than
- © : ©
- ...
使用文本标记
文本样式
文本样式的作用是对文本进行修饰:
- <b>...</b>:加粗
- <i>...</i>:倾斜
- <u>...</u>:下划线
- <s>...</s>:删除线
- <sup>...</sup>:上标
- <sub>...</sub>:下标
标题元素 <hn>
标题元素让文字以醒目的方式显示,往往用于文章的标题。
<h#> ... </h#> # = 1,2,3,4,5,6
<h1></h1>一级标题 ,字最大。
<h6></h6>六级标题,字最小。
段落元素 <p>
<p> 元素提供了结构化文本的一种方式,<p> 元素中的文本会用单独的段落显示。特点如下:
- 与前后的文本都换行分开
- 添加一段额外的垂直空白距离,作为段落间距
换行元素 <br>
使用 <br> 元素在任何地方创建手工换行。
分区元素 <span> 和 <div>
分区元素用于为元素分组,常用于页面布局。
- 行分区
<span></span>
主要作用是包裹文本,做文本的样式。
- 块分区
<div></div>
div的主要工作,就是布局,没有显示效果,主要用于页面的布局或分组。
行内元素与块级元素
- 块级元素
默认情况下,块级元素会独占一行,即元素前后都会自动换行,如 <p>、<div>、<hn>。
特点:修改文本样式。
- 行内元素
不会换行,可以和其他行内元素位于同一行,如 <span>、<b>、<i>、<u>。
特点:主要场合是在布局上。
注意:
- 所有的行内元素不允许嵌套块级元素;
- 块级元素中可以嵌套所有的行内元素;
- p 标记是不允许嵌套其他块级元素;
- div 允许嵌套所有的元素;
- div 没有特殊情况是不允许被其他元素嵌套;
- div 能嵌套 div;
- td 能嵌套 div;
- li 能嵌套 div;
- dt,dd 能嵌套 div。
分隔线元素 <hr>
<hr> 元素用于在页面上创建一条水平线,常用于将页面的不同部分隔开。
属性:
size 尺寸
width 宽度
align 水平对齐方式
color 颜色
预格式化 <pre>
保留源文档中的格式,即保留原来换行和文本中的空白。
时间: 2024-10-24 15:23:35