手写笔记

---

一、HTML 和 CSS 概述

1.1 什么是 HTML？

• 全称：HyperText Markup Language（超文本标记语言）
• 作用：用于描述网页的结构与内容，通过各类标签定义标题、段落、图片、链接等页面元素
• 规范制定：由 W3C（万维网联盟，World Wide Web Consortium）组织定义与维护

1.2 什么是 CSS？

• 全称：Cascading Style Sheets（层叠样式表）
• 作用：用于控制网页元素的外观与布局，实现结构与样式分离，可定义颜色、字体、边距、背景、响应式布局等
• 规范制定：同样由 W3C 组织制定与维护

1.3 权威学习资料

• 推荐查询网站：MDN Web Docs（https://developer.mozilla.org）
• 特点：提供最权威、最完整的 HTML/CSS 语法说明、浏览器兼容性信息与实战教程

---

二、开发环境准备

2.1 浏览器的核心地位

HTML/CSS 代码最终需要在浏览器中解析、渲染并展示，因此浏览器是前端开发的核心运行与调试环境。

2.2 浏览器的组成结构

浏览器主要分为两大部分：

• 外壳（Shell）：用户可见的交互界面，包含地址栏、菜单栏、书签栏、前进/后退按钮等
• 内核（Core）：浏览器的核心引擎，负责解析 HTML/CSS/JavaScript 代码并渲染为可视化页面，是决定网页兼容性与性能的关键

2.3 常见浏览器及其内核

浏览器名称	内核名称	说明
Google Chrome	Blink（基于 WebKit 分叉）	市场占有率最高，开发者首选调试浏览器
Microsoft Edge	Blink	新版基于 Chromium 内核，与 Chrome 高度兼容
Mozilla Firefox	Gecko	独立开源内核，注重隐私与可扩展性
Apple Safari	WebKit	苹果生态专属内核，是早期 Chrome 内核的技术基础
Opera	Blink	早期使用 Presto 内核，后切换为 Chromium 内核

---

三、核心总结

• HTML：负责网页的结构与内容，是网页的“骨架”
• CSS：负责网页的样式与布局，是网页的“皮肤”
• 浏览器内核：决定了网页如何被解析与渲染，是前端兼容性问题的核心来源
• 权威资料：MDN Web Docs 是查询 HTML/CSS 规范与用法的首选平台