什么是前端?
前端,又称 Web 前端,是直接面向用户展示网页的层。一个完整的软件通常由后端逻辑与前端界面共同构成。常见的应用场景包括 Web 页面、PC 端应用程序以及移动端 APP 界面。掌握前端开发后,你将能够独立构建基础的 Web 页面。
开发环境搭建
推荐使用 VS Code 作为开发工具,它是目前企业级前端开发的主流选择。安装后建议添加以下插件以提升效率:
- Auto Rename Tag:修改标签名时自动同步闭合标签。
- View In Browser:在编辑器内直接预览浏览器效果。
- Live Server:保存文件后浏览器自动刷新,实时查看更改。
HTML 基础结构
HTML 是超文本标记语言,通过标签组合来呈现文本、图片、视频等多种数据。所有 HTML 页面最终都在浏览器中运行。
创建一个 .html 文件,核心结构如下:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>页面标题</title>
</head>
<body>
<!-- 页面可见内容 -->
</body>
</html>
html:根标签。head:存放页面属性,如编码、标题等,不直接显示内容。title:定义浏览器标签页显示的标题。body:包含页面实际展示的信息。
这些标签构成了 DOM 树结构,每个标签都是一个对象,可通过代码进行增删查改。
在 VS Code 中输入 ! 然后按回车,可快速生成上述标准模板。其中 lang 指定语言,charset 设置字符编码,viewport 用于移动端适配。
常用标签详解
文本与排版
- 注释:使用
<!-- 内容 -->,浏览器不会渲染。 - 标题:
h1到h6,数字越大字体越小。 - 段落:
<p>内容</p>,段落间有默认间距。

