结构化标记:可用来描述标题和段落的元素。
语义化标记:表达特定含义的标记。
标题
通常用于强调一篇文章。
html中有的标题有6个级别。
示例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>标题</
title
>
</
head
>
<
body
>
<
h1
>这是1级标题</
h1
>
<
h2
>这是1级标题</
h2
>
<
h3
>这是1级标题</
h3
>
<
h4
>这是1级标题</
h4
>
<
h5
>这是1级标题</
h5
>
<
h6
>这是1级标题</
h6
>
</
body
>
</
html
>
|
段落
在html中用<p></p>元素表示段落。
示例
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>段落</
title
>
</
head
>
<
body
>
<
p
>这是段落</
p
>
<
p
>这也是段落</
p
>
</
body
>
</
html
>
|
粗体和斜体
在html中用<b></b>元素表示粗体,用<i></i>表示斜体。
示例
1
2
3
4
5
6
7
8
9
10
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>粗体和斜体</
title
>
</
head
>
<
body
>
<
p
>这是一段话,其中有部分是<
b
>粗体</
b
>,有部分是<
i
>斜体</
i
>。</
p
>
</
body
>
</
html
>
|
粗体和斜体是结构化标记。
上标和下标
在html中用<sup></sup>元素表示上标,用<sub></sub>下标。
示例
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>上标和下标</
title
>
</
head
>
<
body
>
<
p
>今天气温是23<
sup
>o</
sup
></
p
>
<
p
>二氧化碳这样表示CO<
sub
>2</
sub
></
p
>
</
body
>
</
html
>
|
上标和下标是结构化标记。
空白
空白可以增强代码的可读性。
当浏览器遇到两个或两个以上的连续空格时,只将其显示为一个空格。
示例
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>空白</
title
>
</
head
>
<
body
>
<
p
>这是一段 佳
话:学 好编程,就能改 变世界!</
p
>
</
body
>
</
html
>
|
显示效果如下
换行符
在html中用<br>元素表示换行符。换行符只有开始标签,没有结束标签。
示例
1
2
3
4
5
6
7
8
9
10
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>换行符</
title
>
</
head
>
<
body
>
<
p
>人所缺乏的不是才干而是志向,<
br
>不是成功的能力而是勤劳的意志。</
p
>
</
body
>
</
html
>
|
水平线
水平线通常用来在不同的主题间进行切换。或用于增强视觉效果。
示例
1
2
3
4
5
6
7
8
9
10
11
12
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>水平线</
title
>
</
head
>
<
body
>
<
p
>人所缺乏的不是才干而是志向,<
br
>不是成功的能力而是勤劳的意志。</
p
>
<
hr
>
<
p
>你知道吗?上面有条水平线呢</
p
>
</
body
>
</
html
>
|
强调和加粗
在html中用<strong></strong>元素表示强调,表示其中的内容十分重要,以粗体显示。
在html中用<em></em>元素表示强调,强度比<strong>低点,以斜体显示。
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>强调和加粗</
title
>
</
head
>
<
body
>
<
p
>两部门:推进住房租赁资产证券化<
strong
>盘活存量资产</
strong
></
p
>
<
p
>善林金融非法吸资<
em
>600</
em
>亿8人被捕</
p
>
</
body
>
</
html
>
|
块引用和短引用
在html中用<blockquote></blockquote>元素表示块引用,块引用可以包括多个段落,以缩进的形式显示。
在html中用<q></q>元素表示短引用。
示例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>块引用和短引用</
title
>
</
head
>
<
body
>
<
blockquote
>
<
p
>这部分将是块引用,它可以包括段落。</
p
>
<
p
>这是块引用的第二个段落。</
p
>
</
blockquote
>
<
p
>这部分是短引用。鲁迅说,<
q
>世上本没有程序员,写代码的人多了,于是就有了程序员。</
q
></
p
>
</
body
>
</
html
>
|
缩写词
在HTML5中缩写词和首字母缩写词都使用<abbr></abbr>元素表示。
示例
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>缩写词</
title
>
</
head
>
<
body
>
<!-- 缩写词和首字母缩写词都使用abbr -->
<
p
><
abbr
>ERP</
abbr
> Enterprise Resource Planning</
p
>
</
body
>
</
html
>
|
引文
引文用于引用一部书籍或电影,在html中用<cite></cite>元素表示引文,在浏览器中以斜体显示。
示例
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>引文</
title
>
</
head
>
<
body
>
<!-- 引文用于引用一部书籍或电影 -->
<
p
>最近你看了古天乐主演的 <
cite
>杀破狼.贪狼</
cite
> 么</
p
>
</
body
>
</
html
>
|
定义
定义用于解释一些术语。
在html中用<dfn></dfn>元素表示定义。
示例
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>定义</
title
>
</
head
>
<
body
>
<!-- 定义,解释一些术语 -->
<
p
>面向对象<
dfn
></
dfn
>(Object Oriented,OO)是软件开发方法</
p
>
</
body
>
</
html
>
|
地址
在html中用<address></dfnaddress元素表示地址,在浏览器中以斜体显示。
示例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>地址</
title
>
</
head
>
<
body
>
<!-- 定义,解释一些术语 -->
<
p
>上海宋庆龄故居位于</
p
>
<
address
>
<
p
>上海市淮海中路1843号</
p
>
</
address
>
</
body
>
</
html
>
|
内容修改元素
在html中用<ins></ins元素表示插入的内容,在浏览器中有下划线。
在html中用<del></del元素表示删除的内容,在浏览器中有删除线显示。
在html中用<s></s元素表示不确定的内容,在浏览器中以中间穿一条线显示。
示例
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<!DOCTYPE html>
<
html
lang
=
"zh"
>
<
head
>
<
meta
charset
=
"UTF-8"
>
<
title
>内容修改元素</
title
>
</
head
>
<
body
>
<!-- 内容修改元素有ins del s -->
<
p
>ins 表示插入的内容。<
ins
>插图</
ins
></
p
>
<
p
>del 表示删除的内容。<
del
>注意,这是删除的内容</
del
>></
p
>
<
p
>s 表示不确定的内容。<
s
>这是不确定的内容</
s
>></
p
>
</
body
>
</
html
>
|