文本元素
HTML5中支持的元素: HTML元素周期表
h元素
h元素包含h1~h6,六个元素 分别表示从一级标题到六级标题
小技巧:在文本下添加一行 按 ctrl + 空格 在文本上添加一行 ctrl + shift + 空格
vscord 快速生成代码
例如:
h1*6
生成 六个 h1元素
h1*6>{一级标题}
其中 > 号表示子元素 h1 的子元素为文本 就是 元素的内容
h$*> {$级标题}
$符从一开始自增。
p元素
表示:段落
HTML是写的静态内容,内容是不会变化的,一般HTML段落的内容是随便写的,段落的内容通过js代码或后端来改变的
所以为了观看显示效果,一般通过 lorem(乱数假文) 生成文字
例如:
p$*6>lorem
生成6个含有乱数假文的p元素
P$*6>lorem num
num表示要生成的乱数假文的单词数
span 【无语义】
无语义,仅用于样式的显示
Container with no semantic meaning.
无语义的容器 表示将某些内容包含起来,单独设置样式
<p>红,黄,蓝</p>
要想将红黄蓝三个字单独设置颜色 可以使用span元素
<p> <span style = "color: red;">红</span>,<span style = "color: yellow ;">黄</span>,<span style = "color: blue ;">蓝</span> <p>
以前: 某些元素在显示时会独占一行(块级元素),某些元素不会(行级元素)
而到html5弃用了这种说法
pre
与格式化文本元素
空白折叠: 在源代码中的连续空白的字符(空格,换行,制表)在页面显示时会被折叠为一个空格。
目的是为了将源代码和页面显示分开来
例外:在pre元素中不会出现空白折叠 在pre元素的内容会按照源代码的格式进行显示
该元素通常用于在网页中显示一些代码。
pre元素功能的本质:是有默认css属性
显示代码是通常在外面套用code元素 code元素代表此区域为代码区域。