常见的文本html的元素,html常见文本元素介绍与应用

h1 ~ h6 元素

标题(Heading)：是通过

-

等标签进行定义的，

定义最大的标题。

定义最小的标题。

This is a h1

This is a h2

This is a h3

This is a h4

This is a h5

This is a h6

标题元素

注意：

请确保将 HTML heading 标签只用于标题。不要仅仅是为了产生粗体或大号的文本而使用标题。

搜索引擎使用标题为您的网页的结构和内容编制索引。

因为用户可以通过标题来快速浏览您的网页，所以用标题来呈现文档结构是很重要的。

应该将 h1 用作主标题(最重要的)，其后是 h2(次重要的)，再其次是 h3，以此类推。

p 元素

段落：是通过

标签定义的，可以把 HTML 文档分割为若干段落。

冬天 (朱自清散文)

说起冬天，忽然想到豆腐。是一“小洋锅”(铝锅)白煮豆腐，热腾腾的。水滚着，像好些鱼眼睛，一小块一小块豆腐养在里面，嫩而滑，仿佛反穿的白狐大衣。锅在“洋炉子”(煤油不打气炉)上，和炉子都熏得乌黑乌黑，越显出豆腐的白。这是晚上，屋子老了，虽点着“洋灯”，也还是阴暗。围着桌子坐的是父亲跟我们哥儿三个。“洋炉子”太高了，父亲得常常站起来，微微地仰着脸，觑着眼睛，从氤氲的热气里伸进筷子，夹起豆腐，一一地放在我们的酱油碟里。我们有时也自己动手，但炉子实在太高了，总还是坐享其成的多。这并不是吃饭，只是玩儿。父亲说晚上冷，吃了大家暖和些。我们都喜欢这种白水豆腐；一上桌就眼巴巴望着那锅，等着那热气，等着热气里从父亲筷子上掉下来的豆腐。

又是冬天，记得是阴历十一月十六晚上，跟S君P君在西湖里坐小划子。S君刚到杭州教书，事先来信说：“我们要游西湖，不管它是冬天。”那晚月色真好，想起来还像照在身上。本来前一晚是“月当头”；也许十一月的月亮真有些特别吧。那时九点多了，湖上似乎只有我们一只划子。有点风，月光照着软软的水波；当间那一溜儿反光，像新砑的银子。湖上的山只剩了淡淡的影子。山下偶尔有一两星灯火。S君口占两句诗道：“数星灯火认渔村，淡墨轻描远黛痕。”我们都不大说话，只有均匀的桨声。我渐渐地快睡着了。P君“喂”了一下，才抬起眼皮，看见他在微笑。船夫问要不要上净寺去；是阿弥陀佛生日，那边蛮热闹的。到了寺里，殿上灯烛辉煌，满是佛婆念佛的声音，好像醒了一场梦。这已是十多年前的事了，S君还常常通着信，P君听说转变了好几次，在一个特税局里收特税了，以后便没有消息。

在台州过了一个冬天，一家四口子。台州是个山城，可以说在一个大谷里。只有一条二里长的大街。别的路上白天简直不大见人；晚上一片漆黑。偶尔人家窗户里透出一点灯光，还有走路的拿着的火把；但那是少极了。我们住在山脚下。有的是山上松林里的风声，跟天上一只两只的鸟影。夏末到那里，春初便走，却好像老在过着冬天似的；可是即便真冬天也并不冷。我们住在楼上，书房临着大路；路上有人说话，可以清清楚楚地听见。但因为走路的人太少了，间或有点说话的声音，听起来还只当远风送来的，想不到就在窗外。我们是外路人，除上学校去之外，常只在家里坐着。妻也惯了那寂寞，只和我们爷儿们守着。外边虽老是冬天，家里却老是春天。有一回我上街去，回来的时候，楼下厨房的大方窗开着，并排地挨着她们母子三个；三张脸都带着天真微笑地向着我。似乎台州空空的，只有我们四人；天地空空的，也只有我们四人。那时是民国十年，妻刚从家里出来，满自在。她死了快四年了，我却还老记着她那微笑的影子。

无论怎么冷，大风大雪，想到这些，我心上总是温暖的。

p元素.png

strong 与 em 元素

标签把文本定义为语气更强的强调的内容。 标签和 [ 标签]一样，用于强调文本，但它强调的程度更强一些。

标签把文本定义为强调的内容。 标签告诉浏览器把其中的文本表示为强调的内容。对于所有浏览器来说，这意味着要把这段文字用斜体来显示。

<strong> 标签把文本定义为语气更强的强调的内容。

<em> 标签把文本定义为强调的内容。

在上面的代码中，"" 代表 ">"。

strong 和 em 元素

注意：如果只是为了达到某种视觉效果而使用这些标签的话，建议您使用样式表。

b 与 i 元素

标签呈现粗体文本效果。 标签和基于内容的样式标签 [] 类似。它告诉浏览器将包含其中的文本以粗体字显示。

标签显示斜体文本效果。 标签和基于内容的样式标签 [] 类似。它告诉浏览器将包含其中的文本以斜体字(italic)或者倾斜(oblique)字体显示。

这是普通文本 - 这是粗体文本。

这是普通文本 - 这是斜体文本。

b 和 i 元素

注意：如果只是希望通过这些标签单纯地改变文本的样式，建议使用样式表来取得更加丰富的效果。

pre 元素

 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

 标签的一个常见应用就是用来表示计算机的源代码。

这是正常

的文本

这是预格式化 的

文本

pre元素

由上述代码可知，在正常的元素中，无论使用多少个空格或换行符，都只会折叠成一个空格；而在pre中，会保留空格和换行符，显示的文本格式和html文件中的文本格式是一致的。

[扩展]：

空白折叠：在源代码中的连续空白字符(空格、换行、制表)，在页面显示时，会被折叠成为一个空格。而在pre元素中的内容不会出现空白折叠，在pre元素中的内容，会按照源代码格式显示到页面上。

显示代码时，通常在外面套一个code元素，code表示代码区域。

del 和 ins 元素

标签定义文档中已被删除的文本。

标签定义已经被插入文档中的文本。与 [] 一同使用，来描述文档中的更新和修正。

现价￥15 原价￥20

del 和 ins 元素

big 和 small 元素

标签呈现大号字体效果。

标签呈现小号字体效果。

大号字体

正常字体

小号字体

big 和 small 元素

sup 和 sub 元素

标签可定义上标文本。这个标签在向文档添加脚注以及表示方程式中的指数值时非常有用。如果和 标签结合起来使用，就可以创建出很好的超链接脚注。

标签可定义下标文本

这段文本包含 ^上标。

这段文本包含 _下标。

sup 和 sub 元素

blockquote 和 q 元素

标签定义块引用。

与

之间的所有文本都会从常规文本中分离出来，经常会在左、右两边进行缩进(增加外边距)，而且有时会使用斜体。也就是说，块引用拥有它们自己的空间。

标签定义短的引用。 标签在本质上与 [

] 是一样的。不同之处在于它们的显示和应用。 标签用于简短的行内引用。如果需要从周围内容分离出来比较长的部分(通常显示为缩进的块)，请使用

标签。

Here is a long quotation here is a long quotation here is a long quotation

here is a long quotation here is a long quotation here is a long quotation

here is a long quotation here is a long quotation here is a long quotation.

短引用

blockquote 和 q 元素

code 元素

标签用于表示计算机源代码或者其他机器可以阅读的文本内容。

代码片段：

123

Lorem ipsum dolor sit amet, consectetur adipisicing elit

code 元素