HTML基础

最新推荐文章于 2024-12-16 16:52:23 发布

Hacker_Hacker__

最新推荐文章于 2024-12-16 16:52:23 发布

阅读量462

点赞数

CC 4.0 BY-SA版权

文章标签：前端

本文链接：https://blog.youkuaiyun.com/Hacker_Hacker__/article/details/118996713

本文详细介绍了Web标准的三层结构，包括HTML用于结构、CSS用于表现和JavaScript用于行为。接着，深入讲解了HTML的基本概念，如超文本标记语言的性质、网页元素的组成以及常用标签的使用，如标题、段落、图像和链接。此外，还提到了HTML标签的语义化、文档类型DOCTYPE、字符集以及标签属性。最后，讨论了HTML中的路径类型和链接的打开方式。

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

一、Web标准

1.Web标准不是某一个标准，而是由W3C组织和其他标准化组织制定的一系列标准的集合。

2.web标准有三层结构，分别是结构、表现和行为。

（1）结构：用于对网页元素进行整理和分类，主要学的是HTML。

（2）表现：用于设置网页元素的版式、颜色、大小等外观样式，主要学的是CSS。

（3）行为：用于网页模型的定义及交互的编写，主要学的是JavaScript。

3.结构类似人的身体，表现类似人的着装，行为类似人的行为动作，理想状态下，他们三层都是独立的，放到不同的文件里面

二、认识HTML

1.HTML 指的是超文本标记语言，是用来描述网页的一种语言。不是一种编程语言，而是一种标记语言。标记语言是一套标记标签。

2.网页是由网页元素组成的，这些元素是利用html标签描述出来，例如图片标签、文字标签、链接标签等，然后通过浏览器解析，就可以显示给用户。

3.所谓超文本含义：它可以加入图片、声音、动画、多媒体等内容（超越文本限制）。不仅如此，它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超级链接文本）。

三、HTML 初识

1.HTML骨架标签

（1）<html></html> HTML标签，页面中最大的标签，称为根标签。

（2）<head></head> 文档的头部，称为头标签，注意在head标签中我们必须设置的标签是<title>。

（3）<title></title> 文档的标题，称为标题标签，让页面拥有一个属于自己的网页标题。

（4）<body></body> 文档的主体，称为主体标签，元素包含文档的所有内容，页面内容基本都放到<body>里面。

2.HTML元素标签分类

（1）常规元素（双标签）：<标签名>内容</标签名>，该语法中“<标签名>”表示该标签的作用开始，一般称为“开始标签”，“</标签名>” 表示该标签的作用结束，一般称为“结束标签。有开始有结束里面包含内容。

（2）空元素（单标签）：<标签名/>，里面不需要包含内容，只有一个开始标签不需要关闭。例如

3.HTML标签关系（主要针对于双标签的互相关系）

（1）嵌套关系：

（2）并列关系：

4.文档类型<!DOCTYPE>

（1）作用：<!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。<!DOCTYPE html>就是告诉浏览器按照HTML5 规范解析页面。HTML文件必须加上 DOCTYPE 声明，并统一使用 HTML5 的文档声明。

（2）页面语言lang：代表当前网页中使用的语言，指定html语言种类。

例：<html lang="en"> en定义内容语言为英文。

例：<html lang="zh-CN"> zh-CN定义内容语言为中文。

（3）字符集：字符集是多个字符的集合。

例：<meta charset ="UTF-8"/> utf-8是目前最常用的字符集编码方式，基本包含全世界所有国家需要用到的字符，是必须要写的代码，否则可能引起乱码的情况。

其他常用的字符集编码方式还有gbk和gb2312。gb2312 简单中文包括6763个汉字。GBK包含全部中文字符，是GB2312的扩展，加入对繁体字的支持，兼容GB2312。

5.HTML标签的语义化

1.所谓标签语义化，就是指标签的含义。（1）方便代码的阅读和维护（2）同时让浏览器或是网络爬虫可以很好地解析，从而更好分析其中的内容（3）使用语义化标签会具有更好地搜索引擎优化。

四、HTML常用标签

1.排版标签

（1）标题标签h系列标签 <h1></h1>~<h6></h6>

作用：HTML提供了六个等级标签，作为标题使用，并且依据重要性递减，加了标题的文字会变的加粗，字号也会依次变大，一行是只能放一个标题的。