html的网页基本特征是什么,html的基础-CSDN博客

本文详细介绍了前端开发的基础，包括HTML5的结构、CSS的装饰作用和JavaScript的行为层。重点讲解了HTML5的常用标签如p、h、div、span、img、a以及表单元素form和高级标签table的使用。还强调了标签语义化的概念及其重要性，对于SEO和页面结构清晰度有显著影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前端主要由三大块组成：

1、Html网页内容的载体，是“结构层”

2、Css对页面进行修饰，是“表现层”

3、Javascript实现页面特效(动画、交互)，是“行为层”

一、认识html

1、定义：超文本标记语言。

超文本：音频、视频、图像等；

标记：标签。

2、开发环境：文本编辑工具—sublime

优点：轻量级，开发速度快

使用sublime时，用“ctrl+n”新建文件，“ctrl+s”保存文件

注意：输入文件名时要自己添加后缀“.html”。

3、运行环境：浏览器谷歌，火狐，IE，opera

二、html5结构

版本标识html5

语言是：English

使用meta标签中的属性charset，防止中文乱码

Document页面标题

内容

三、html常用标签(标签有语义)

1、p标签：段落标签，用来存放大量的文字

特征：(1)默认宽度是父元素宽度的100%

(2)可以设置宽/高

(3)独占一行

2、h标签：标题标签

特征：(1)h1-h6 字体由大到小，默认加粗

(2)默认宽度是父元素宽度的100%

(3)可以设置宽/高

(4)独占一行

这是标题一

这是标题二

...

这是标题六

注意：h1标签在一个页面上只能使用一次，与SEO(搜索引擎)有关：优先选择title“网页标题”相关内容，其次选择h1相关内容，h1多写会被SEO认为滥用。

3、div和span标签：没有任何语义，用来实现页面布局

(1)div：是一个块元素，无语义，可以包含其他html标签，可以将网页分为几个区块，用于排版布局。

(2)Span：是一个行内元素，通常用来定义一小段文字样式。

特征：a.同一行显示，

b.宽度由内容决与p标签不同，不换行

注意：与标签区分开。

可以使用“p*3 “ctrl+e””直接生成三行

4、格式化标签(都是双标签、行内元素，格式化标签可嵌套)

(1)：粗体文字(bold)

(2)：粗体，加重语义

(3)：大号字

(4)：斜体(emphasized)，加重语义

(5)：斜体(italic)

(6)：小号字

(7)_{：下标字(subscript)}

(8)^{：上标字(superscript)}

(9)~~：删除字~~

注意：(1)“与”，“与”这两组语义相同，但SEO在搜索时会优先筛选加重语义的标签信息。

(2)i：icon(小图标意思)，图标首选标签。

5、img标签(单标签，为网页插入图片)

%E2%80%9D%E5%9C%B0%E5%9D%80%E2%80%9Dalt=%E2%80%9D%E5%9B%BE%E7%89%87%E5%8A%A0%E8%BD%BD%E5%A4%B1%E8%B4%A5%E2%80%9D%C2%A0width=%E2%80%9D%E5%AE%BD%E2%80%9D%C2%A0hight=%E2%80%9D%E9%AB%98%E2%80%9D%C2%A0title=%E2%80%9D%E6%88%91%E6%98%AF%E4%B8%80%E5%B9%85%E5%9B%BE%E2%80%9D