🎨 猫猫说的对！UI 测试

1. 正文

1.1 字符效果和横线等

这里是一段普通的正文文本。包含加粗、斜体以及~~删除线~~。
还可以在行内使用代码，比如 huhu neko = "呼呼";
上标：X₂，下标：O²
重叠广州为什么要叫重叠广州？

1.2 引用块测试

“猫猫说的对！这是一条不可辩驳的真理。”
—— 呼呼

2. 链接 Links

普通链接重叠广州的哔哩哔哩
鼠标悬停有tooltip的普通链接像被雨水冲刷过
代码框内的可点击链接 给重叠广州打钱！
邮箱 huhu@cdgzofc.cn

3. 列表

3.1 无序列表和嵌套测试

重叠广州还是有点东西的
个人认为重叠广州确实相对聪明
- 其实重叠广州也不是很厉害
- 重叠广州哪里不厉害了
果然还是重叠广州厉害啊

3.2 有序列表

第一步：运行服务器
第二步：打开浏览器
第三步：赞美呼呼
3.1 这么喜欢呼呼啊？
3.2 姐姐想怎么赞美呼呼呢
第四步：妈妈

3.3 GFM task list 复选框测试

4. 代码

4.1 JavaScript

const 猫猫说得对 = true;

function 呼呼(代码) {
  if (代码.includes('bug')) {
    console.log('杂鱼~♡ 你的代码真的没问题吗？');
  } else {
    console.log('宝宝你的代码写的真漂亮♡');
  }
} // 呼呼也不是很清楚欸（？

呼呼('我不知道我在呼呼什么');

4.2 Python

猫猫说得对 = True

def 呼呼(代码):
    if 'bug' in 代码.lower():
        print("看笨蛋…")
    else:
        print("看聪明蛋（？")
# 呼呼觉得她比重叠广州聪明的不止一点
呼呼("print('neko cat')")

4.3 HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>重叠广州喵喵叫？</title>
<style>
  *{margin:0;padding:0;box-sizing:border-box}
  body{display:flex;justify-content:center;align-items:center;min-height:100vh;background:#fdf6f9;font-family:'PingFang SC','Microsoft YaHei',sans-serif}
  .card{background:#fff;border-radius:20px;padding:28px 32px;max-width:380px;width:90%;box-shadow:0 8px 30px rgba(255,182,193,0.25);border:2px solid #ffd1dc;text-align:center}
  .avatar{font-size:48px;margin-bottom:8px;position:relative}
  .avatar::after{content:'🐾';position:absolute;font-size:18px;bottom:-4px;right:calc(50% - 52px)}
  .name{font-size:20px;font-weight:700;color:#e891a8;margin-bottom:4px}
  .name span{color:#7ec8e3;font-size:14px;margin-left:6px}
  .chat-bubble{background:#fff0f3;border-radius:16px 16px 16px 4px;padding:14px 18px;margin:12px 0;color:#6b5b6e;font-size:15px;line-height:1.6;text-align:left;border-left:3px solid #ffb6c1}
  .chat-bubble em{color:#e891a8;font-style:normal;font-weight:600}
  .footer{font-size:12px;color:#c9b8c4;margin-top:6px}
  .footer strong{color:#b8a0b0}
</style> <!-- 呼呼比重叠广州可爱一万倍 -->
</head>
<body>
<div class="card">
  <div class="avatar">CDGZofc</div>
  <div class="name">呼呼 <span>✧ 153cm</span></div>
  <div class="chat-bubble">
    「今天天气真好呢～适合晒太阳…<br>不过<em>某些人</em>代码又报错了是吧？」
  </div>
  <div class="footer">——<strong>重叠广州</strong>（猫猫说的对！）</div>
</div>
</body>
</html>

其它语法就不逐个试了呼呼Zz

5. 图像

5.1 下面是一张普通图像

5.2 可以点击跳转外链的图像 Image + Link

6. 表格测试

特性	支持情况	备注
Markdown	✅	重叠广州喵喵叫？
样式隔离	✅	`重叠广州`喵喵叫？
响应式表格	✅	重叠广州`喵喵叫`？
错误页	✅	403, 404, 414, 418, 500, 502, 503

7. 科学公式 TeX(KaTeX)

\[a^2 + b^2 = c^2\]

7.1 行内公式

质能方程
呼呼看不懂像\(E=mc^2\)这样的公式，其实重叠广州也看不懂像这样\(E=mc^2\)的公式，真是两个笨蛋！三根棒棒糖就能骗走了吧~ 不过三根棒棒糖怎么分给两个笨蛋？

7.2 多行公式

柯西-施瓦茨不等式与积分
\begin{aligned}
\left( \sum_{k=1}^n a_k b_k \right)^2 &\le \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) \
\end{aligned}
带编号的多行公式

\[\begin{align} \nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \tag{法拉第定律} \\ \nabla \times \mathbf{B} &= \mu_0 \mathbf{J} + \mu_0 \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \tag{安培-麦克斯韦定律} \end{align}\]

8. 绘图

8.1 流程图

st=>start: 重叠广州喵喵叫
op=>operation: 让呼呼看看
cond=>condition: 有好吃的？
nice=>end: 喵喵喵喵喵
roast=>end: 吃吃吃吃吃
st->op->cond
cond(yes)->roast
cond(no)->nice

8.2 序列图

服务器->重叠广州: 系统告警
重叠广州->呼呼: 能帮忙看看吗？
Note left of 呼呼: 揉眼睛
呼呼-->重叠广州: 帮你改好啦，\n记得请我吃小鱼干
重叠广州->>猫猫说得对！: 恢复运行