Tiptap富文本编辑器示例代码-html代码-BFW代码库

Tiptap富文本编辑器示例代码

代码语言：html

所属分类：其他

代码描述：Tiptap富文本编辑器示例代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8" />
  <title>Tiptap.js 编辑器示例（纯前端）</title>
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <!-- ProseMirror 基础样式，提供选区高亮等 -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/prosemirror-view/style/prosemirror.css">
  <style>
    :root {
      --bg: #0b1020;
      --card: #121a2e;
      --card2: #0f172a;
      --text: #e5e7eb;
      --muted: #9aa4b2;
      --brand: #5b8cff;
      --brand-2: #8aa2ff;
      --border: #233052;
    }
    * { box-sizing: border-box; }
    body {
      margin: 0; background: var(--bg); color: var(--text);
      font-family: ui-sans-serif, -apple-system, Segoe UI, Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Helvetica, Arial;
      line-height: 1.5;
    }
    .wrap {
      max-width: 1000px; margin: 32px auto; padding: 0 16px;
    }
    .title {
      font-size: 24px; font-weight: 700; margin-bottom: 12px;
    }
    .sub { color: var(--muted); margin-bottom: 20px; }
    .card {
      background: linear-gradient(180deg, var(--card), var(--card2));
      border: 1px solid var(--border);
      border-radius: 16px; box-shadow: 0 8px 30px rgba(0,0,0,.25);
      overflow: hi.........完整代码请登录后点击上方下载按钮下载查看