| 1 | <!DOCTYPE html> |
| 2 | <html lang="zh-CN"> |
| 3 | <head> |
| 4 | <meta charset="UTF-8"> |
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| 6 | <title>学术论文 · Academic Paper</title> |
| 7 | <style> |
| 8 | *{margin:0;padding:0;box-sizing:border-box} |
| 9 | html,body{width:100%;height:100%;overflow:hidden;background:#0f1117} |
| 10 | body{display:grid;place-items:center;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif} |
| 11 | .slide{position:relative;width:min(100vw,calc(100vh*16/9));aspect-ratio:16/9;overflow:hidden;background:linear-gradient(145deg,#fafafa 0%,#f5f5f5 60%,#ececec 100%);box-shadow:0 0 0 1px rgba(255,255,255,.06)} |
| 12 | .bar{position:absolute;top:0;left:0;right:0;height:clamp(3px,.4vw,5px);background:linear-gradient(90deg,#1e40af,#2563eb)} |
| 13 | .wrap{position:absolute;inset:clamp(3px,.4vw,5px) 0 0 0;display:flex;flex-direction:column;padding:clamp(14px,2.6vw,34px) clamp(20px,4vw,52px) clamp(10px,1.8vw,24px)} |
| 14 | .journal{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:clamp(4px,.8vw,10px);border-bottom:1px solid #d4d4d4} |
| 15 | .j-name{font-family:Georgia,"Songti SC",serif;font-size:clamp(8px,1.1vw,13px);color:#171717;font-style:italic;font-weight:600} |
| 16 | .j-meta{font-family:"SFMono-Regular",Consolas,monospace;font-size:clamp(6px,.7vw,8px);color:#737373} |
| 17 | .title-area{text-align:center;padding:clamp(8px,1.6vw,20px) clamp(20px,4vw,52px) clamp(4px,.8vw,10px)} |
| 18 | .title{font-family:Georgia,"Songti SC",serif;font-size:clamp(13px,2.4vw,30px);color:#171717;font-weight:bold;line-height:1.3} |
| 19 | .authors{font-family:Georgia,"Songti SC",serif;font-size:clamp(8px,1vw,12px);color:#525252;margin-top:clamp(4px,.8vw,10px)} |
| 20 | .authors sup{font-size:.75em;color:#2563eb} |
| 21 | .affil{font-family:Georgia,"Songti SC",serif;font-size:clamp(6px,.75vw,9px);color:#737373;margin-top:clamp(2px,.4vw,5px)} |
| 22 | .abs-box{background:rgba(255,255,255,.7);border:1px solid #e0e0e0;border-radius:2px;padding:clamp(8px,1.4vw,18px) clamp(10px,1.8vw,24px);margin:0 auto;max-width:clamp(200px,42vw,560px)} |
| 23 | .abs-label{font-family:"SFMono-Regular",Consolas,monospace;font-size:clamp(6px,.7vw,8px);color:#2563eb;font-weight:bold;letter-spacing:.12em;margin-bottom:clamp(3px,.5vw,6px)} |
| 24 | .abs-text{font-family:Georgia,"Songti SC",serif;font-size:clamp(7px,.9vw,11px);color:#404040;line-height:1.8;text-align:justify} |
| 25 | .abs-text em{color:#2563eb;font-style:normal} |
| 26 | .cols{display:flex;gap:0;flex:1;margin-top:clamp(8px,1.6vw,20px)} |
| 27 | .col{flex:1;padding:0 clamp(8px,1.6vw,22px)} |
| 28 | .col:first-child{padding-left:0;border-right:1px solid #e0e0e0} |
| 29 | .col:last-child{padding-right:0;padding-left:clamp(8px,1.6vw,22px)} |
| 30 | .col-title{font-family:Georgia,"Songti SC",serif;font-size:clamp(8px,1vw,12px);font-weight:bold;color:#171717;font-style:italic;margin-bottom:clamp(4px,.8vw,10px)} |
| 31 | .col-text{font-family:Georgia,"Songti SC",serif;font-size:clamp(7px,.85vw,10px);color:#404040;line-height:1.85;text-align:justify} |
| 32 | .col-text a{color:#2563eb;text-decoration:none} |
| 33 | .eq{text-align:center;font-family:Georgia,"Songti SC",serif;font-size:clamp(8px,1vw,12px);color:#171717;margin:clamp(6px,1vw,14px) 0;padding:clamp(4px,.8vw,10px);background:rgba(37,99,235,.03);border-radius:2px} |
| 34 | .eq span{color:#2563eb} |
| 35 | .chart{margin-top:clamp(8px,1.4vw,18px);display:flex;align-items:flex-end;justify-content:center;gap:clamp(6px,1.2vw,16px);height:clamp(40px,7vw,90px)} |
| 36 | .bar-grp{display:flex;flex-direction:column;align-items:center;gap:clamp(2px,.4vw,5px)} |
| 37 | .bar-rect{width:clamp(14px,2.4vw,30px);border-radius:1px 1px 0 0} |
| 38 | .bar-label{font-family:"SFMono-Regular",Consolas,monospace;font-size:clamp(5px,.6vw,7px);color:#737373} |
| 39 | .fig-cap{font-family:Georgia,"Songti SC",serif;font-size:clamp(6px,.7vw,8px);color:#737373;text-align:center;margin-top:clamp(4px,.6vw,8px)} |
| 40 | .fig-cap b{color:#171717} |
| 41 | .footer{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:clamp(4px,.8vw,10px);border-top:1px solid #d4d4d4} |
| 42 | .refs{font-family:"SFMono-Regular",Consolas,monospace;font-size:clamp(5px,.6vw,7px);color:#a3a3a3} |
| 43 | .palette{display:flex;gap:clamp(3px,.4vw,5px)} |
| 44 | .sw{width:clamp(9px,1.2vw,14px);height:clamp(9px,1.2vw,14px);border-radius:1px;background:var(--c);border:1px solid rgba(0,0,0,.08)} |
| 45 | </style> |
| 46 | </head> |
| 47 | <body> |
| 48 | <div class="slide"> |
| 49 | <div class="bar"></div> |
| 50 | <div class="wrap"> |
| 51 | <div class="journal"> |
| 52 | <span class="j-name">Journal of Applied Research</span> |
| 53 | <span class="j-meta">Vol. 12 · No. 4 · 2026 · pp. 1–14</span> |
| 54 | </div> |
| 55 | <div class="title-area"> |
| 56 | <div class="title">深度学习驱动的多模态信息抽取：方法与实证</div> |
| 57 | <div class="authors">张明<sup>a</sup> 李华<sup>b</sup> 王强<sup>a</sup></div> |
| 58 | <div class="affil"><sup>a</sup>清华大学计算机系 <sup>b</sup>北京大学信息科学学院</div> |
| 59 | </div> |
| 60 | <div class="abs-box"> |
| 61 | <div class="abs-label">Abstract</div> |
| 62 | <div class="abs-text">本文提出一种基于<em>Transformer</em>架构的多模态信息抽取框架，通过跨模态注意力机制实现文本与图像特征的深层融合。实验表明，在三个公开数据集上F1值平均提升<em>4.7%</em>，显著优于现有基线方法。</div> |
| 63 | </div> |
| 64 | <div class="cols"> |
| 65 | <div class="col"> |
| 66 | <div class="col-title">1. Introduction</div> |
| 67 | <div class="col-text">信息抽取是自然语言处理的核心任务之一。预训练语言模型的发展为这一领域带来了突破性进展<a>[1]</a>。然而多模态场景仍面临挑战：如何有效融合视觉与文本特征<a>[2,3]</a>。核心贡献包括跨模态注意力融合模块与大规模评测基准。</div> |
| 68 | <div class="eq">Y = argmax<sub>θ</sub> P(<span>θ</span> | X<sub>text</sub>, X<sub>img</sub>)</div> |
| 69 | </div> |
| 70 | <div class="col"> |
| 71 | <div class="col-title">2. Results</div> |
| 72 | <div class="chart"> |
| 73 | <div class="bar-grp"><div class="bar-rect" style="height:45%;background:rgba(37,99,235,.35);border:1px solid #2563eb"></div><div class="bar-label">BERT</div></div> |
| 74 | <div class="bar-grp"><div class="bar-rect" style="height:58%;background:rgba(37,99,235,.35);border:1px solid #2563eb"></div><div class="bar-label">RoBERTa</div></div> |
| 75 | <div class="bar-grp"><div class="bar-rect" style="height:82%;background:rgba(37,99,235,.55);border:1px solid #2563eb"></div><div class="bar-label">Ours</div></div> |
| 76 | <div class="bar-grp"><div class="bar-rect" style="height:70%;background:rgba(147,197,253,.5);border:1px solid #3b82f6"></div><div class="bar-label">-attn</div></div> |
| 77 | <div class="bar-grp"><div class="bar-rect" style="height:55%;background:rgba(147,197,253,.5);border:1px solid #3b82f6"></div><div class="bar-label">-fuse</div></div> |
| 78 | <div class="bar-grp"><div class="bar-rect" style="height:38%;background:rgba(147,197,253,.5);border:1px solid #3b82f6"></div><div class="bar-label">base</div></div> |
| 79 | </div> |
| 80 | <div class="fig-cap"><b>Fig. 1</b> 各方法 F1 score 对比（深蓝为完整模型）</div> |
| 81 | </div> |
| 82 | </div> |
| 83 | <div class="footer"> |
| 84 | <span class="refs">[1] Devlin et al. 2019 [2] Lu et al. 2022 [3] Chen et al. 2023</span> |
| 85 | <div class="palette"> |
| 86 | <i class="sw" style="--c:#171717"></i> |
| 87 | <i class="sw" style="--c:#404040"></i> |
| 88 | <i class="sw" style="--c:#2563eb"></i> |
| 89 | <i class="sw" style="--c:#3b82f6"></i> |
| 90 | <i class="sw" style="--c:#93c5fd"></i> |
| 91 | <i class="sw" style="--c:#fafafa"></i> |
| 92 | </div> |
| 93 | </div> |
| 94 | </div> |
| 95 | </div> |
| 96 | </body> |
| 97 | </html> |
| 98 |