CodePen
添加对 CodePen 的支持，其是一个用于测试 JavaScript、 CSS 和 HTML 的在线代码编辑器。
赞助
成为我们的资助者或赞助商，以支持我们的工作。
本页内容
赞助商
语法
1{{< codepen [user] [id] >}}
参数
user
| 索引 | 名称 | 类型 | 必填 | 默认值 | 版本 | 示例 |
|---|---|---|---|---|---|---|
#0 | user | string | ✓ | - | - | - |
用户 ID。
id
| 索引 | 名称 | 类型 | 必填 | 默认值 | 版本 | 示例 |
|---|---|---|---|---|---|---|
#1 | id | string | ✓ | - | - | - |
代码 ID。
theme
| 索引 | 名称 | 类型 | 必填 | 默认值 | 版本 | 示例 |
|---|---|---|---|---|---|---|
| - | theme | string | - | - | - | - |
主题。
可选项：light, dark。
defaultTabs
| 索引 | 名称 | 类型 | 必填 | 默认值 | 版本 | 示例 |
|---|---|---|---|---|---|---|
| - | defaultTabs | string | - | html,result | - | - |
默认的、逗号分隔开的标签栏。
可选项：js, html, css, result。
height
| 索引 | 名称 | 类型 | 必填 | 默认值 | 版本 | 示例 |
|---|---|---|---|---|---|---|
| - | height | number | - | 300 | - | - |
Frame 高度。
示例
源码
1{{< codepen razonyang YzWGJNQ >}}结果
自定义默认标签栏的 CodePen
源码
1{{< codepen user=razonyang id=YzWGJNQ defaultTabs=css,result >}}结果
浅色主题的 CodePen
源码
1{{< codepen user=razonyang id=YzWGJNQ theme=light >}}结果
自定义默认标签栏的、深色主题的 CodePen
源码
1{{< codepen user=razonyang id=YzWGJNQ defaultTabs=js,result theme=dark >}}结果