什么是 CodePen Pen？
CodePen Pen 是 CodePen 平台上的一个独立代码片段（“Pen”），它允许你使用 HTML、CSS 和 JavaScript 编写前端代码，并实时预览效果。每一个 Pen 都可以被保存、分享，甚至嵌入到其他网站中。
无论你是初学者还是资深开发者，CodePen 都能为你提供一个轻量、高效的实验环境。
核心特性
实时预览
修改代码立即看到效果，无需刷新页面。
多语言支持
支持 HTML、CSS、JavaScript 及其预处理器（如 SCSS、Babel 等）。
社区分享
一键发布，全球开发者都能看到并 fork 你的作品。
简单示例
下面是一个典型的 CodePen Pen 结构：
<!-- HTML -->
<div class="hello">Hello, CodePen!</div>
<!-- CSS -->
.hello {
color: #61dafb;
font-size: 24px;
text-align: center;
}
<!-- JS -->
console.log('Pen loaded!');
立即体验 CodePen
为什么选择 CodePen？
CodePen 不仅是一个代码编辑器，更是一个创意展示平台。许多前端面试题、UI 动画、交互原型都在这里诞生。它帮助开发者快速验证想法、学习新技术，并与社区互动。
此外，CodePen 还支持协作编辑、项目管理（Projects）、模板收藏等高级功能，满足从个人实验到团队协作的多种需求。