diff options
Diffstat (limited to '2026')
| -rw-r--r-- | 2026/08/20/房颤心电图解析/index.html | 2 |
1 files changed, 1 insertions, 1 deletions
diff --git a/2026/08/20/房颤心电图解析/index.html b/2026/08/20/房颤心电图解析/index.html index 41b2b0db..c1795b28 100644 --- a/2026/08/20/房颤心电图解析/index.html +++ b/2026/08/20/房颤心电图解析/index.html @@ -207,7 +207,7 @@ <p>下图为教学示意,不是患者原始心电图的重建,也不用于自动诊断。点击“播放动画”后,扫描线会沿时间轴移动;点击观察点按钮可以突出相应标注。动画用于说明“连续记录”和“节律间期”的概念,不代表真实心电设备的采样参数。</p> <div class="ecg-demo" data-ecg-demo> <style> -.ecg-demo{--ink:#1c1917;--muted:#78716c;--paper:#faf8f5;--grid:rgba(210,190,174,.42);--red:#dc2626;--blue:#2563eb;--green:#15803d;margin:2rem 0;padding:1rem;background:var(--paper);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);color:var(--ink);overflow:hidden}.ecg-demo *{box-sizing:border-box}.ecg-demo h3{margin:0;font-size:1rem}.ecg-demo p{margin:.35rem 0 0;color:var(--muted);font-size:.8rem;line-height:1.65}.ecg-demo-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;border-bottom:1px solid #d6d3d1;padding-bottom:.7rem}.ecg-demo-badge{padding:.2rem .45rem;border:1px solid var(--red);color:var(--red);font:700 .7rem/1.2 monospace;transform:rotate(-1deg)}.ecg-demo-controls{display:flex;flex-wrap:wrap;gap:.45rem;margin:.8rem 0}.ecg-demo button{cursor:pointer;padding:.38rem .58rem;border:1px solid #a8a29e;background:#fff;color:var(--ink);font:700 .72rem/1.2 monospace}.ecg-demo button:hover,.ecg-demo button[data-active=true]{border-color:var(--ink);background:var(--ink);color:#fff}.ecg-demo-canvas{overflow-x:auto;padding:.55rem;border:1px solid #78716c;background-color:#fffdfb;background-image:linear-gradient(to right,var(--grid) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:10px 10px}.ecg-demo-canvas svg{display:block;width:100%;min-width:620px;height:auto}.ecg-demo .ecg-trace{stroke-dasharray:5 2;animation:ecg-flow 1.8s linear infinite}.ecg-demo .scan-line{animation:ecg-scan 3.2s linear infinite}.ecg-demo .pulse-dot{animation:ecg-pulse 1.2s ease-in-out infinite}.ecg-demo.paused .ecg-trace,.ecg-demo.paused .scan-line,.ecg-demo.paused .pulse-dot{animation-play-state:paused}.ecg-demo .layer{transition:opacity .22s ease}@keyframes ecg-flow{to{stroke-dashoffset:-28}}@keyframes ecg-scan{from{transform:translateX(0)}to{transform:translateX(650px)}}@keyframes ecg-pulse{0%,100%{opacity:.3;r:3}50%{opacity:1;r:6}}.ecg-demo-note{margin-top:.7rem;padding:.65rem .75rem;border-left:4px solid var(--blue);background:#eff6ff;color:#1e3a8a;font-size:.82rem;line-height:1.7}.ecg-demo-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.75rem;font:.7rem/1.5 monospace}.ecg-demo-legend span{padding:.35rem;background:#fff;border:1px solid #d6d3d1}@media(max-width:640px){.ecg-demo-head{display:block}.ecg-demo-badge{display:inline-block;margin-top:.55rem}.ecg-demo-legend{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.ecg-demo .ecg-trace,.ecg-demo .scan-line,.ecg-demo .pulse-dot{animation:none}} +.ecg-demo{--ink:#1c1917;--muted:#78716c;--paper:#faf8f5;--grid:rgba(210,190,174,.42);--red:#dc2626;--blue:#2563eb;--green:#15803d;margin:2rem 0;padding:1rem;background:var(--paper);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);color:var(--ink);overflow:hidden}.ecg-demo *{box-sizing:border-box}.ecg-demo h3{margin:0;font-size:1rem}.ecg-demo p{margin:.35rem 0 0;color:var(--muted);font-size:.8rem;line-height:1.65}.ecg-demo-head{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem;border-bottom:1px solid #d6d3d1;padding-bottom:.7rem}.ecg-demo-badge{padding:.2rem .45rem;border:1px solid var(--red);color:var(--red);font:700 .7rem/1.2 monospace;transform:rotate(-1deg)}.ecg-demo-controls{display:flex;flex-wrap:wrap;gap:.45rem;margin:.8rem 0}.ecg-demo button{cursor:pointer;padding:.38rem .58rem;border:1px solid #a8a29e;background:#fff;color:var(--ink);font:700 .72rem/1.2 monospace}.ecg-demo button:hover,.ecg-demo button[data-active=true]{border-color:var(--ink);background:var(--ink);color:#fff}.ecg-demo-canvas{overflow-x:auto;padding:.55rem;border:1px solid #78716c;background-color:#fffdfb;background-image:linear-gradient(to right,var(--grid) 1px,transparent 1px),linear-gradient(to bottom,var(--grid) 1px,transparent 1px);background-size:10px 10px}.ecg-demo-canvas svg{display:block;width:100%;min-width:620px;height:auto}.ecg-demo .ecg-trace{stroke-dasharray:none}.ecg-demo .scan-line,.ecg-demo .pulse-dot{animation:ecg-scan 3.2s linear infinite}.ecg-demo.paused .scan-line,.ecg-demo.paused .pulse-dot{animation-play-state:paused}.ecg-demo .layer{transition:opacity .22s ease}@keyframes ecg-scan{from{transform:translateX(0)}to{transform:translateX(650px)}}.ecg-demo-note{margin-top:.7rem;padding:.65rem .75rem;border-left:4px solid var(--blue);background:#eff6ff;color:#1e3a8a;font-size:.82rem;line-height:1.7}.ecg-demo-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.75rem;font:.7rem/1.5 monospace}.ecg-demo-legend span{padding:.35rem;background:#fff;border:1px solid #d6d3d1}@media(max-width:640px){.ecg-demo-head{display:block}.ecg-demo-badge{display:inline-block;margin-top:.55rem}.ecg-demo-legend{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.ecg-demo .ecg-trace,.ecg-demo .scan-line,.ecg-demo .pulse-dot{animation:none}} </style> <div class="ecg-demo-head"><div><h3>连续节律示意:窦性心律与房颤</h3><p>教学示意|动画表示时间轴移动,不代表原始检测记录</p></div><span class="ecg-demo-badge">ECG SKETCH</span></div> <div class="ecg-demo-controls" role="group" aria-label="心电图动画控制"><button type="button" data-play data-active="true">暂停动画</button><button type="button" data-focus="all" data-active="true">总览</button><button type="button" data-focus="pwave">P 波 / f 波</button><button type="button" data-focus="rr">R-R 间期</button><button type="button" data-focus="qrs">QRS 波群</button></div> |
