timmy / Lit 與 Tailwind CSS 表單範例
0 likes
0 forks
1 files
Last active 10 months ago
這段 HTML 結合 Lit 與 Tailwind CSS，建立了一個自訂 Web Component <custom-form>，包含 使用者名稱（唯讀）、電子郵件、密碼輸入欄位及提交按鈕，並透過 LitElement 繪製至 Light DOM 以確保 Tailwind CSS 樣式生效。此範例適用於 動態 Web 表單開發，可作為登入或註冊介面，並可進一步擴展以支援更多互動功能。
| 1 | <!DOCTYPE html> |
| 2 | <html lang="en"> |
| 3 | <head> |
| 4 | <meta charset="UTF-8"> |
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| 6 | <title>Lit Form Example</title> |
| 7 | <!-- 引入 Tailwind CSS --> |
| 8 | <script src="https://cdn.tailwindcss.com"></script> |
| 9 | <!-- 引入 Lit --> |
| 10 | <script type="module" src="https://cdn.jsdelivr.net/npm/lit@2.8.0/+esm"></script> |
Newer
Older