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 >}}結果