文本

结构化标记:可用来描述标题和段落的元素。

语义化标记:表达特定含义的标记。

标题

通常用于强调一篇文章。

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 >

猜你喜欢

转载自www.cnblogs.com/lszw/p/10482755.html