html 基础（1）-CSDN博客

本文链接：https://blog.csdn.net/m0_62675832/article/details/123032625

一丶html（Hyoer Text Markeup Language)---------超文本标记语言

1. html是一种用来制作超文本文档的简单标记语言。

所谓的“超文本”就是页面内可以包含图片、链接，甚至音乐、程序、视频等非文字元素。

二丶html 标签介绍

1.html 中的注释

①格式：

②“注释”：主要是对某些标签，和html以及其他的代码进行解释说明。方便其他的人员在阅读html源文件的时候，方便理解和读懂我们书写的代码。

③html中的注释不会被显示在浏览器中，但是会显示在源代码文件中。

2.单标签：

使用单独的一个标签就可以完成某种效果

例：<br />（换行标签），<hr />（水平线标签）

3.双标签

①格式：<标签名 key=value key=value>标签封装的数据</ 标签名>

②双标签分为：开始标签和结束标签

③在开始标签中可以书写key=value这样的属性数据。一般要求key对应的value值需要使用单引号或者双引号引用起来。

例：<font color="red" size="7"> 封装的数据</ font>

三丶html 的结构说明

1.HTML 文档的开始需要版本声明，剩下的页面内容需要包含在开始标记<html>和结束标记</html>之间。

2.在<html>元素中，包含两个主要的部分，文件头部分（<head>元素）和主体部分（<body>元素）。

3.标准HTML文档的结构如下所示：

<!DOCTYPE html>
<html>
    <head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
	</body>
</html>

注：

①1：<head>中的内容是在浏览器中内容无法显示的，这里是给服务器、浏览器、链接外部JS、CSS样式等区域。

②<title>中放置的是网页标题，可在浏览器最上面看到。

③<meta>标签描述了一些基本的元数据(网页的基本信息)。元数据也不显示在页面上，但会被浏览器解析。

META 元素通常用于指定网页的描述，关键词，一般放于<head> 区域

④body区放置的内容就可以通过浏览器呈现给用户，其内容可以是table表格布局格式内容，也可以DIV布局的内容，也可以直接是文字。body是最主要区域，网页的内容呈现区。

四丶常用标签的介绍

1.字体标签：<font> </ font>

font标签表示html中的字体。

font标签中的属性：

color ：表封装的数据的颜色

size ：封装的数据的大小,大小是从1~7,7最大，1最小。

2.字体加粗：<strong> </ strong>

3.标题标签：<h1> </ h1> ~ <h6> </ h6>

在html中可以使用h标签来定义标题。

4.段落标签：<p> </ p>

P标签表示段落标签的意思，使用在段与段之间会有点间隔。

5.①换行标签：<br />

在描述一段文字的时候，需要换行时，可以使用<br/>标签

②水平线标签：<hr />

需要水平线时，可以使用<hr/>标签

这两个标签是单标签，哪里需要使用就在哪里使用。

6.斜体标签：<em> </ em>

有时候为了引起别人的关注，可以使用斜体的字，斜体字需要使用<em>标签。

7.图片

在程序中很多时候需要引入图片，可以使用<img>标签来引入一张图片

语法：<img src="图片路径" alt="替换文本" width="x" height="y"/>

img标签的使用：主要功能是在页面上显示图片，他是一个单标签，注意后面必须要闭合

alt 图片的描述信息，如果图片无法显示，就会把这个属性中的数据，显示在浏览器中，

注意：当用户把鼠标移动到 img 元素上时，Internet Explorer （9 之前的版本）把 alt 属性的值显示为工具提示。

根据 HTML 规范，这种行为并不正确。最新的浏览器取消了这一特征。

src 图片的位置一般可以写某个文件夹中的图片，也可以写网络中存在的图片； ../表示上一级目录

border 图片的边框一般设置成像素，很少使用

width 设置宽度一般都是像素

height 设置高度一般都是像素