HTML标签--学习笔记1-优快云博客

本文详细介绍前端开发的基础概念，包括HTML、CSS和JavaScript的作用与使用方法，以及如何利用这些技术创建网页的基本结构和样式。文中还提供了示例代码，帮助初学者理解如何设置网页编码、标题及文本样式。

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

首先，先介绍一下前端，前端说白了就是我们眼睛所看到的页面上呈现的东西，这些都归前端管。HTML、CSS、JavaScript这三个是前端开发中最基本也是最必须的三个技能。前端的开发中，在页面的布局时， HTML将元素进行定义，CSS对展示的元素进行定位，再通过JavaScript实现相应的效果和交互。作为前端初学者，不建议下载一些自动填充代码的软件，一个记事本就可以。如果要下载的话，可以下一个notepad++，点击链接自行下载：
http://www.notepad-plus-plus.org/downloads/

文档声明

新建一个txt文件，我们的来认识一下这第一行代码，DOCTYPE翻译为文档类型，那么这句话的意思就是：声明网页文件的文档类型是html5的文档类型。

<!DOCTYPE html>

HTML标签

html标签分为两种：单标签和双标签

双标签：

标签	作用
<html> </html>	文档的根节点
<head> </head>	文档的头部，放置不参与页面内容展示的一些功能标记
<body> </body>	文档的主体部分，放置程序（页面）可视化的内容
<title> </title>	文档的标题
<b> </b>	字体加粗
<i> </i>	字体倾斜
<u> </u>	为文本添加下划线
<s> </s>	为文本添加删除线，如删除
<sup> </sup>	上角标，如X²
<sub> </sub>	下角标，如H₂
<font> </font>	设置字体大小（size）、颜色（color：范围是1~7）、风格（face）
<p> </p>	段落标签
<h1> </h1>	一级标题标签（h1~h6）
<a> </a>	用href属性可存放超链接，target:"_blank"属性可在跳转时，新开一个窗口

双标签：

标签	作用
<meta>	设置浏览器解析网页的编码格式
<br>	换行
<hr>	水平线
<img>	图片标签

标签使用举例：

<font></font>标签通常是放在<body></body>标签中，下面这段代码的意思是：将浏览器解析网页的编码格式设置为utf-8；将html文件的标题设为“打个广告”；文本内容为“飘柔洗发水，去屑更轻柔”，将文本加粗，字体倾斜，把文本大小设为7，把文本颜色设置为紫色，文本字体设置为宋体。其实，本人在写这篇博客的时候就用到了这个font标签，因为优快云它的字体默认的是微软雅黑，而我觉得还是宋体好看些，你看这篇文章是不是用的宋体呀：）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>打个广告</title>
	</head>
	<body>
		<font color="purple" size="7" face="宋体"><b><i>飘柔洗发水，去屑更轻柔</i></b></font>
	</body>
</html>