MEET THE TOOLS

灏忓瀛︿範灏忓伐鍏?/span>鎵撳紑灏辫兘鐢?/span>

鎶勫彞瀛愩€佹煡鐢熷瓧銆佺粌鍙ｇ畻銆佸仛璁″垝锛岃繖浜涙瘡澶╀細閬囧埌鐨勫皬闇€姹傦紝閮芥斁杩涚硸鏋滅洅瀛愰噷銆備笉鐢ㄦ敞鍐岋紝涓嶇敤涓嬭浇銆?/p>

WIDGETS

鐩掑瓙閲屾湁浠€涔堬紵

姣忎竴涓伐鍏烽兘鏉ヨ嚜鐪熷疄闇€姹傦紝涓嶆槸鍑戞暟鐨勩€?/p>

ABOUT TANGGUO HEZI

鎴戞槸涓€涓竴骞寸骇濂冲鐨勭埜鐖革紝鍋氳繖涓綉绔欏彧鏄兂璁╁涔犺交鏉句竴鐐圭偣

濂冲効鍒氫笂涓€骞寸骇锛岄渶瑕佹瘡澶╃Н绱紭缇庡彞瀛愩€傚彞瀛愪笉闅炬壘锛岄毦鐨勬槸鎸戝嚭閫傚悎瀛╁瓙璇汇€侀€傚悎瀛╁瓙鍐欍€佸張涓嶄細澧炲姞璐熸媴鐨勫唴瀹广€?/p>

绯栨灉鐩掑瓙鐨勬瘡涓伐鍏凤紝閮戒粠涓€涓湡瀹炵殑灏忛渶姹傚紑濮嬨€傚仛鍑烘潵涔嬪墠锛屾垜浠細鍙嶅鎺ㄦ暡锛氬瀛愯兘涓嶈兘鐪嬫噦锛屾楠や細涓嶄細澶锛岀粌涔犺妭濂忔槸涓嶆槸鍚堥€傦紝瀹堕暱鐢ㄨ捣鏉ユ槸涓嶆槸鐪佹椂銆佺渷鍔涖€佺渷蹇冦€?/p>

浜庢槸灏辨湁浜嗙涓€棰楃硸鏋滐細鍙ュ瓙鎶勫啓銆備互鍚庤繖閲屼細涓€鐐圭偣瑁呰繘鏇村璇枃銆佹暟瀛︺€佸涔犱範鎯拰鎵撳嵃妯℃澘灏忓伐鍏枫€?/p>

鍙ュ瓙鎶勫啓灏忛笩鍦ㄦ爲涓婂敱姝屻€?/strong> 鎷奸煶路鐢板瓧鏍?路绗旈『

姣忔棩浠诲姟 灏戦噺銆佷笓娉ㄣ€佽鐪熷啓

鍎跨灏忓瓧鍏?/span> 鍏堜粠鍙ュ瓙閲岃璇嗗瓧

HOW IT HELPS

璁╁伐鍏锋洿杞伙紝璁╁涔犳洿瀹规槗鍧氭寔

01
瀛╁瓙鑷繁浼氱敤

鐣岄潰绠€鍗曪紝娌℃湁骞垮憡锛屾病鏈夊脊绐椼€傚瀛愭墦寮€灏辩煡閬撴€庝箞鍋氾紝涓嶉渶瑕佸闀夸竴鐩磋瑙ｃ€?/p>

02
瀹堕暱涓嶇敤鍙嶅鎿嶅績

甯哥敤鍐呭鎻愬墠澶囧ソ銆傝鎵撳嵃鐩存帴鎵撳嵃锛岃缁冧範鐩存帴缁冧範锛屼竴涓綉鍧€灏辫兘寮€濮嬨€?/p>

03
璺熺潃瀛╁瓙涓€璧烽暱澶?/h3>
浠庝竴骞寸骇寮€濮嬶紝鎱㈡參澧炲姞瀛╁瓙鐪熸鐢ㄥ緱涓婄殑宸ュ叿锛屽洜涓烘垜浠嚜宸变篃鏈夊瀛愬湪鐢ㄣ€?/p>

GET STARTED

鍏堜粠涓€鍙ヨ瘽寮€濮?/h2>
鍙ュ瓙鎶勫啓鏄硸鏋滅洅瀛愮殑绗竴涓伐鍏凤紝宸茬粡鏀寔鎷奸煶銆佺敯瀛楁牸銆佺瑪椤哄拰鍎跨瀛楀吀銆?/p>

绯栨灉鐩掑瓙
tangguohezi.com 路灏忓瀛︿範灏忓伐鍏风

宸ュ叿绠?/span> 璇枃鏁板 瀛︿範涔犳儻鎵撳嵃妯℃澘

涓€涓埜鐖稿仛鐨勭綉绔欙紝涓撲负灏忓瀹跺涵璁捐銆?/p>

鍙ュ瓙鎶勫啓宸ュ叿

涓€骞寸骇鍙ュ瓙鎶勫啓宸ュ叿

甯︽嫾闊炽€佺敯瀛楁牸銆佺瑪椤哄拰鍎跨灏忓瓧鍏革紝鏀寔鐢熸垚鍙墦鍗扮殑鍙ュ瓙鎶勫啓缁冧範绾搞€?/p>

鍙ュ瓙鍒楄〃

鉁嶏笍鑷敱褰曞叆

杈撳叆瑕佹妱鍐欑殑鍙ュ瓙锛堟瘡琛屼竴鍙ワ級锛?/label> <button id="btn-clear-custom" class="btn btn-outline" style="width: 100%">涓€閿竻绌?/button> </div> </div> </div>  <div class="settings-card"> <div class="settings-toggles"> <div class="toggle-item"> <span>鏄剧ず鎷奸煶</span> <label class="toggle-switch"> <input type="checkbox" id="toggle-pinyin" checked> <span class="toggle-slider"></span> </label> </div> <div class="toggle-item"> <span>鏄剧ず鐢板瓧鏍?/span> <label class="toggle-switch"> <input type="checkbox" id="toggle-grid" checked> <span class="toggle-slider"></span> </label> </div> </div> <div class="settings-actions"> <button id="btn-start" class="btn btn-mega">寮€濮嬫妱鍐欙紒</button> <button id="btn-print-setup" class="btn btn-outline btn-print-setup" type="button">鎵撳嵃瀛楀笘</button> </div> </div> </section>  <section id="about-view" class="panel about-classroom" style="display: none;"> <div class="classroom-page"> <header class="classroom-hero"> <div class="classroom-hero-copy"> <div class="classroom-eyebrow">鍙ュ簱璁捐鐞嗗康</div> <h1>璁╂妱鍐欑湡姝ｅ府鍒拌〃杈?/h1> <p>涓€骞寸骇瀛╁瓙闇€瑕佺殑涓嶅彧鏄€滃ソ鍙ュ瓙鈥濓紝鑰屾槸鑳芥妸鐢熸椿閲岀殑浜嬫儏璇存竻妤氥€備袱涓彞搴撳搴斾袱绉嶇粌涔犵洰鏍囷細鍏堜細琛ㄨ揪锛屽啀杞昏交绉疮浼樼編璇█銆?/p> </div> <div class="classroom-hero-visual" aria-hidden="true"> <div class="practice-photo-card"> <div class="paper-line short"></div> <div class="paper-line"></div> <div class="copy-grid-preview"> <span>鎴?/span><span>浼?/span><span>琛?/span><span>杈?/span> </div> </div> <div class="floating-badge">鍏堣〃杈?/div> </div> </header> <section class="section classroom-transform" id="sec1"> <div class="section-lead"> <h2>涓轰粈涔堣鍒嗘垚涓や釜鍙ュ簱锛?/h2> <p>鍥犱负鈥滀紭缇庘€濆拰鈥滀細琛ㄨ揪鈥濅笉鏄悓涓€涓兘鍔涖€傚瀛愬啓鐪嬪浘鍐欒瘽鏃讹紝鏈€鍏堥渶瑕佺殑鏄畬鏁淬€佸叿浣撱€佽兘杩佺Щ鐨勫彞瀛愮粨鏋勩€?/p> </div> <div class="transform-layout"> <div class="board-preview" aria-hidden="true"> <div class="board-title">浠婃棩缁冧範</div> <div class="board-card primary">琛ㄨ揪璁粌搴?br><strong>鎴戝厛娲楁墜锛屽啀鍚冮キ銆?/strong></div> <div class="board-card soft">浼樼編绉疮搴?br><strong>鐧戒簯鍍忚蒋杞殑妫夎姳绯栥€?/strong></div> <div class="mini-clock">10:00</div> </div> <div class="feature-list"> <div class="feature-item"> <span class="feature-icon"></span> <h3>鍏堝缓绔嬪彞瀛愰鏋?/h3> <p>璋佸湪鍋氫粈涔堛€佸湪鍝噷銆佸厛鍚庨『搴忥紝杩欎簺鏄瀛愮湡姝ｈ兘杩佺Щ鍒颁綔鏂囬噷鐨勮兘鍔涖€?/p> </div> <div class="feature-item"> <span class="feature-icon accent"></span> <h3>鍐嶈ˉ鍏呰瑷€鐢婚潰</h3> <p>浼樼編鍙ュ瓙閫傚悎鏅ㄨ銆佹憳鎶勫拰浜插瓙鍏辫锛岀敤鏉ュ煿鍏昏鎰燂紝鑰屼笉鏄ぇ閲忕‖鑳屻€?/p> </div> <div class="feature-item"> <span class="feature-icon green"></span> <h3>缁冧範閲忚杞?/h3> <p>姣忓ぉ鍗佸垎閽燂紝灏戦噺銆佷笓娉ㄣ€佽兘澶嶈堪锛屾瘮涓€娆℃妱寰堝鍙ユ洿閫傚悎涓€骞寸骇銆?/p> </div> </div> </div> </section> <section class="section classroom-practice" id="sec2"> <h2>鐪嬩竴涓瀛愮湡姝ｄ細鐢ㄧ殑缁冧範璺緞</h2> <div class="practice-story"> <div class="story-phone" aria-hidden="true"> <div class="phone-screen"> <div class="phone-title">妯′豢璇翠竴鍙?/div> <div class="phone-sentence">鎴戝厛鏁寸悊涔﹀寘锛屽啀鍐欎綔涓氥€?/div> <div class="phone-grid"><span></span><span></span><span></span></div> </div> </div> <div class="story-copy"> <h3>浠庘€滄妱涓嬫潵鈥濆埌鈥滆鍑烘潵鈥?/h3> <p>琛ㄨ揪璁粌搴撶殑閲嶇偣涓嶆槸璁╁瀛愯儗鐔熶竴鍙ヨ瘽锛岃€屾槸璇诲畬浠ュ悗鑳芥崲鎴愯嚜宸辩殑鐢熸椿鍐呭銆?/p> <ul> <li>鍏堣閫氶『</li> <li>璁ょ湡鎶勫啓</li> <li>妯′豢璇翠竴鍙ヨ嚜宸辩殑璇?/li> </ul> </div> </div> </section> <section class="section classroom-proof" id="sec3"> <h2>鎺ㄨ崘鐨勪娇鐢ㄦ瘮渚?/h2> <p>涓诲簱璐熻矗鑳藉姏锛屽壇搴撹礋璐ｈ鎰熴€傚涓€骞寸骇鏉ヨ锛岃〃杈捐缁冨簲璇ュ崰澶уご銆?/p> <div class="proof-cards"> <div class="proof-card"><span>80%</span><strong>琛ㄨ揪璁粌</strong><p>瀹屾暣鍙ャ€佸姩浣溿€侀『搴忋€佽瀵?/p></div> <div class="proof-card"><span>20%</span><strong>浼樼編绉疮</strong><p>鐢婚潰鎰熴€佷慨杈炪€佹櫒璇绘憳鎶?/p></div> <div class="proof-card"><span>10</span><strong>鍒嗛挓/澶?/strong><p>灏戦噺銆佷笓娉ㄣ€佸鏄撳潥鎸?/p></div> </div> </section> <section class="section classroom-help" id="sec4"> <h2>杩欎釜宸ュ叿鐪熸甯瀛愬仛浠€涔堬紵</h2> <div class="help-row"> <div><h3>鎶婂彞瀛愬啓瀹屾暣</h3><p>鍏堟帉鎻♀€滆皝銆佸湪鍝噷銆佸仛浠€涔堚€濓紝鍐欒瘽鎵嶆湁鍩虹銆?/p></div> <div class="help-visual small-board" aria-hidden="true"><span>璋?/span><span>鍦ㄥ摢</span><span>鍋氫粈涔?/span></div> </div> <div class="help-row reverse"> <div><h3>鎶婂姩浣滃啓鍏蜂綋</h3><p>璺戙€佹嬁銆佹斁銆佽烦銆佽共銆佹暣鐞嗏€︹€﹀姩浣滆秺娓呮锛岀敾闈㈣秺鐪熷疄銆?/p></div> <div class="help-visual action-board" aria-hidden="true"><span>鎷?/span><span>鏀?/span><span>璺?/span></div> </div> <div class="help-row"> <div><h3>鎶婄敓娲昏鍑烘潵</h3><p>浠庤鍫傘€佸搴€佹搷鍦恒€佸ぉ姘旈噷鎵剧礌鏉愶紝瀛╁瓙鏇村鏄撹縼绉汇€?/p></div> <div class="help-visual life-board" aria-hidden="true"><span>鏍″洯</span><span>瀹跺涵</span><span>瑙傚療</span></div> </div> </section> <section class="section classroom-start" id="sec5"> <div class="start-preview" aria-hidden="true"> <div>璇?/div><div>鍐?/div><div>浠?/div> </div> <div> <h2>鏈€缁堢洰鏍囧緢绠€鍗?/h2> <p>涓嶆槸鍩瑰吇鈥滃皬浣滃鈥濓紝鑰屾槸璁╁瀛愪細瑙傚療銆佷細琛ㄨ揪銆佷細鍐欑湡瀹炵敓娲汇€?/p> </div> </section> </div> </section>  <section id="write-panel" class="panel" style="display: none;">  <div class="write-container"> <div class="write-header"> <button id="btn-back" class="btn btn-back">鈫?杩斿洖閫夊彞</button> <div class="breadcrumb"> 棣栭〉 <span class="divider">/</span> <span id="current-category-name">缁冧範</span> </div> </div> <div id="cards-container" class="cards-container">  </div> </div>  <div class="bottom-toolbar"> <button class="icon-btn" id="tb-print" title="鎵撳嵃瀛楀笘">馃枿锔?/button> <button class="icon-btn hidden" id="tb-scroll-top" title="鍥炲埌椤堕儴">猬嗭笍</button> </div> </section> </main> <footer class="footer"> <div>绯栨灉鐩掑瓙路 tangguohezi.com 路灏忓瀛︿範灏忓伐鍏风 路漏 2025</div> <p>涓€涓埜鐖稿仛鐨勭綉绔欙紝涓撲负灏忓瀹跺涵璁捐銆?/p> </footer>   <div id="learn-modal" class="modal-overlay" style="display:none;"> <div class="modal-card"> <button id="btn-close-modal" class="modal-close">×</button> <div class="modal-header"> <div id="modal-char" class="modal-char-display">瀛?/div> <div class="modal-char-info"> <div class="info-row">鎷奸煶锛?strong id="modal-pinyin">zi</strong></div> <div class="info-row">閮ㄩ锛?strong id="modal-radical">瀹€</strong></div> <div class="info-row">绗旂敾锛?strong id="modal-strokes">6</strong></div> </div> </div> <div class="modal-body"> <div class="meaning-box"> <h4>鍎跨鐗堝皬瀛楀吀</h4> <div id="modal-meaning">鍔犺浇涓?..</div> </div> <div class="action-box"> <button id="btn-pronounce" class="btn btn-outline"><span class="btn-line-icon sound-icon" aria-hidden="true"></span>璇婚煶</button> <button id="btn-animate" class="btn btn-primary">鉁忥笍绗旈『婕旂ず</button> </div> <div id="hanzi-writer-target" class="writer-target"></div> </div> </div> </div>  <div id="celebration-modal" class="modal-overlay" style="display:none;"> <div class="modal-card celebration"> <button id="btn-celebration-dismiss" class="modal-close celebration-dismiss" type="button" aria-label="鍏抽棴">脳</button> <div class="trophy-icon" aria-hidden="true"> <svg viewBox="0 0 24 24"> <path d="M8 4h8v4a4 4 0 0 1-8 0V4Z"/> <path d="M8 6H5a2 2 0 0 0 2 4h1"/> <path d="M16 6h3a2 2 0 0 1-2 4h-1"/> <path d="M12 12v4"/> <path d="M9 20h6"/> <path d="M10 16h4l1 4H9l1-4Z"/> </svg> </div> <h2>澶浜嗭紒</h2> <p>灏戦噺銆佷笓娉ㄣ€佽鐪熷啓锛屾瘡澶╄繘姝ヤ竴鐐圭偣銆?/p> <div class="reward-badge"><span class="reward-star" aria-hidden="true"></span><strong id="reward-stars">0</strong><span>棰楁槦鏄熷鍔?/span></div> <button id="btn-celebration-close" class="btn btn-mega">缁х画缁冧範</button> </div> </div>  <script src="lib/cnchar.min.js"></script> <script src="lib/cnchar.radical.min.js"></script> <script src="lib/cnchar.explain.min.js"></script> <script src="lib/hanzi-writer.min.js"></script> <script src="lib/confetti.browser.min.js"></script> <script src="lib/jspdf.umd.min.js"></script>  <script type="module" src="app.js?v=10.16"></script> </body> </html>

灏忓瀛︿範灏忓伐鍏?/span>鎵撳紑灏辫兘鐢?/span>

鐩掑瓙閲屾湁浠€涔堬紵

鎴戞槸涓€涓竴骞寸骇濂冲鐨勭埜鐖革紝鍋氳繖涓綉绔欏彧鏄兂璁╁涔犺交鏉句竴鐐圭偣

璁╁伐鍏锋洿杞伙紝璁╁涔犳洿瀹规槗鍧氭寔

瀛╁瓙鑷繁浼氱敤

瀹堕暱涓嶇敤鍙嶅鎿嶅績

璺熺潃瀛╁瓙涓€璧烽暱澶?/h3> 浠庝竴骞寸骇寮€濮嬶紝鎱㈡參澧炲姞瀛╁瓙鐪熸鐢ㄥ緱涓婄殑宸ュ叿锛屽洜涓烘垜浠嚜宸变篃鏈夊瀛愬湪鐢ㄣ€?/p>

鍏堜粠涓€鍙ヨ瘽寮€濮?/h2> 鍙ュ瓙鎶勫啓鏄硸鏋滅洅瀛愮殑绗竴涓伐鍏凤紝宸茬粡鏀寔鎷奸煶銆佺敯瀛楁牸銆佺瑪椤哄拰鍎跨瀛楀吀銆?/p> 鎵撳紑鍙ュ瓙鎶勫啓

鍙ュ瓙鎶勫啓宸ュ叿

涓€骞寸骇鍙ュ瓙鎶勫啓宸ュ叿

鍙ュ瓙鍒楄〃

鉁嶏笍 鑷敱褰曞叆

璺熺潃瀛╁瓙涓€璧烽暱澶?/h3>
浠庝竴骞寸骇寮€濮嬶紝鎱㈡參澧炲姞瀛╁瓙鐪熸鐢ㄥ緱涓婄殑宸ュ叿锛屽洜涓烘垜浠嚜宸变篃鏈夊瀛愬湪鐢ㄣ€?/p>

鍏堜粠涓€鍙ヨ瘽寮€濮?/h2>
鍙ュ瓙鎶勫啓鏄硸鏋滅洅瀛愮殑绗竴涓伐鍏凤紝宸茬粡鏀寔鎷奸煶銆佺敯瀛楁牸銆佺瑪椤哄拰鍎跨瀛楀吀銆?/p>

鉁嶏笍鑷敱褰曞叆