hello-algo/docs/index.html
Anurag Pandey 01a5f7b09f
Improved HTML Structure for Better Accessibility and Maintainability (#1434)
* Improved HTML Structure for Better Accessibility and Maintainability

Commit Description:

    Semantic Sectioning and Class Names:
        Updated class names to be more descriptive.
        Ensured better readability and maintainability.

    Alt Text for Images:
        Added alt attributes to all <img> tags to improve accessibility.

    SVG Elements:
        Added appropriate role attributes to SVG elements.

    External Links:
        Updated external links to open in a new tab using target="_blank".
        Added rel="noopener noreferrer" for security reasons.

    CSS Separation:
        Inlined styles for demonstration purposes but recommended moving them to a separate stylesheet for better separation of concerns.

* Update index.html

* Update index.html

* Update index.html

* Update index.html

* Update index.html

* Update index.html

---------

Co-authored-by: Yudong Jin <krahets@163.com>
2024-11-25 19:15:06 +08:00

356 lines
23 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!-- Section: hero -->
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
<!-- hero image -->
<img src="assets/hero/universe_bg.png" class="hero-bg" alt="">
<div class="hero-div">
<img src="assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
<img src="assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
<a href="chapter_introduction/">
<img src="assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
<span style="left: 52.244%; top: 20.919%;">初识算法</span>
</a>
<a href="chapter_computational_complexity/">
<img src="assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
<span style="left: 39.244%; top: 33.919%;">复杂度</span>
</a>
<a href="chapter_array_and_linkedlist/">
<img src="assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
<span style="left: 90.897%; top: 76.259%;">数组与链表</span>
</a>
<a href="chapter_stack_and_queue/">
<img src="assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
<span style="left: 77.571%; top: 91.25%;">栈与队列</span>
</a>
<a href="chapter_hashing/">
<img src="assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
<span style="left: 68.862%; top: 46.292%;">哈希表</span>
</a>
<a href="chapter_tree/">
<img src="assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
<span style="left: 96.159%; top: 44.8%;"></span>
</a>
<a href="chapter_heap/">
<img src="assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
<span style="left: 88.103%; top: 15.422%;"></span>
</a>
<a href="chapter_graph/">
<img src="assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
<span style="left: 71.195%; top: 6.503%;"></span>
</a>
<a href="chapter_searching/">
<img src="assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
<span style="left: 14.556%; top: 20.876%;">搜索</span>
</a>
<a href="chapter_sorting/">
<img src="assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
<span style="left: 28.805%; top: 53.808%;">排序</span>
</a>
<a href="chapter_divide_and_conquer/">
<img src="assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
<span style="left: 31.42%; top: 8.679%;">分治</span>
</a>
<a href="chapter_backtracking/">
<img src="assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
<span style="left: 4.742%; top: 50.113%;">回溯</span>
</a>
<a href="chapter_dynamic_programming/">
<img src="assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
<span style="left: 8.561%; top: 75.351%;">动态规划</span>
</a>
<a href="chapter_greedy/">
<img src="assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
<span style="left: 21.619%; top: 86.85%;">贪心</span>
</a>
</div>
<!-- heading -->
<div class="heading-div">
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E7%AE%97%E6%B3%95+!" alt="" />
<div style="pointer-events: auto;">
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
动画图解、一键运行的数据结构与算法教程
</p>
<a href="chapter_hello_algo/" class="rounded-button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
</svg>
<span>开始阅读</span>
</a>
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
</path>
</svg>
<span>代码仓库</span>
</a>
</div>
<!-- arrow -->
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
</svg>
</div>
</div>
</section>
<!-- Section: brief introduction -->
<section data-md-color-scheme="slate" class="home-div">
<div class="section-content">
<img src="index.assets/hello_algo_header.png" style="width: 100%; max-width: 41.5em;" alt="Preview">
<div class="code-badge">
<img src="https://img.shields.io/badge/Python-snow?logo=python&logoColor=3776AB" alt="" />
<img src="https://img.shields.io/badge/Java-snow?logo=coffeescript&logoColor=FC4C02" alt="" />
<img src="https://img.shields.io/badge/C%2B%2B-snow?logo=c%2B%2B&logoColor=00599C" alt="" />
<img src="https://img.shields.io/badge/C-snow?logo=c&logoColor=A8B9CC" alt="" />
<img src="https://img.shields.io/badge/C%23-snow?logo=csharp&logoColor=512BD4" alt="" />
<img src="https://img.shields.io/badge/JS-snow?logo=javascript&logoColor=E9CE30" alt="" />
<img src="https://img.shields.io/badge/Go-snow?logo=go&logoColor=00ADD8" alt="" />
<img src="https://img.shields.io/badge/Swift-snow?logo=swift&logoColor=F05138" alt="" />
<img src="https://img.shields.io/badge/Rust-snow?logo=rust&logoColor=000000" alt="" />
<img src="https://img.shields.io/badge/Ruby-snow?logo=ruby&logoColor=CC342D" alt="" />
<img src="https://img.shields.io/badge/Kotlin-snow?logo=kotlin&logoColor=7F52FF" alt="" />
<img src="https://img.shields.io/badge/TS-snow?logo=typescript&logoColor=3178C6" alt="" />
<img src="https://img.shields.io/badge/Dart-snow?logo=dart&logoColor=0175C2" alt="" />
<img src="https://img.shields.io/badge/Zig-snow?logo=zig&logoColor=F7A41D" alt="" />
</div>
<p style="margin-top: 2em;">500 幅动画图解、14 种编程语言代码、3000 条社区问答,助你快速入门数据结构与算法</p>
</div>
</section>
<!-- Section: reading -->
<section data-md-color-scheme="default" data-md-color-primary="white" class="home-div">
<div class="section-content">
<div class="reading-media">
<!-- devices -->
<!-- book height = 250 mm -->
<!-- mac height = 248.1 mm -->
<!-- ipad height = 280.6mm -->
<!-- iphone height = 160.7mm -->
<div class="media-block">
<a href="chapter_paperbook/">
<div style="height: 8.17%;"></div>
<img class="device-on-hover" style="height: 66.83%;" src="assets/hero/cover_render.png" alt="Cover">
<div class="text-button">
<span>获取纸质书</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
</svg>
</div>
</a>
</div>
<div class="media-block">
<a href="chapter_hello_algo/">
<div style="height: 4.34%;"></div>
<img class="device-on-hover" style="height: 66.31%;" src="assets/hero/web_mac_iphone.png" alt="">
<div style="height: 4.34%;"></div>
<div class="text-button">
<span>在线阅读</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
</svg>
</div>
</a>
</div>
<div class="media-block">
<a href="https://github.com/krahets/hello-algo/releases">
<img class="device-on-hover" style="height: 75%;" src="assets/hero/pdf_ipad.png" alt="">
<div class="text-button">
<span>下载 PDF</span>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
</svg>
</div>
</a>
</div>
</div>
</div>
</section>
<!-- Section: endorsements -->
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
<div class="section-content">
<h3 style="text-align: center; margin: 1em auto;">推荐语</h3>
<div class="intro-container" style="margin: 0 auto;">
<div class="intro-text endor-text">
<p style="margin-bottom: 0;">“一本通俗易懂的数据结构与算法入门书,引导读者手脑并用地学习,强烈推荐算法初学者阅读。”</p>
<p style="font-weight: bold;">—— 邓俊辉,清华大学计算机系教授</p>
</div>
<div class="intro-text endor-text">
<p style="margin-bottom: 0;">“如果我当年学数据结构与算法的时候有《Hello 算法》,学起来应该会简单 10 倍!”</p>
<p style="font-weight: bold;">—— 李沐,亚马逊资深首席科学家</p>
</div>
</div>
</div>
</section>
<!-- Section: features -->
<section data-md-color-scheme="default" data-md-color-primary="white" class="home-div">
<div class="section-content">
<div class="intro-container">
<div class="intro-text">
<div>
<div style="display: flex; align-items: center;">
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
</svg>
<h3 style="margin-left: 0.5em;">动画图解</h3>
</div>
<p style="margin: 0;">内容清晰易懂,学习曲线平滑</p>
<p class="intro-quote">"A picture is worth a thousand words."<br>“一图胜千言”</p>
</div>
</div>
<img class="intro-image" src="index.assets/animation.gif" alt="Animation example">
</div>
<div class="intro-container">
<img class="intro-image" src="index.assets/running_code.gif" alt="Running code example">
<div class="intro-text">
<div>
<div style="display: flex; align-items: center;">
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
</svg>
<h3 style="margin-left: 0.5em;">一键运行</h3>
</div>
<p style="margin: 0;">十余种编程语言,代码可视化运行</p>
<p class="intro-quote">"Talk is cheap. Show me the code."<br>“少吹牛,看代码”</p>
</div>
</div>
</div>
<div class="intro-container">
<div class="intro-text">
<div>
<div style="display: flex; align-items: center;">
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
</svg>
<h3 style="margin-left: 0.5em;">互助学习</h3>
</div>
<p style="margin: 0;">欢迎讨论与提问,读者间携手共进</p>
<p class="intro-quote">"Learning by teaching."<br>“教学相长”</p>
</div>
</div>
<img class="intro-image" src="index.assets/comment.gif" alt="Comments example">
</div>
</div>
</section>
<!-- Section: contributors -->
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
<div class="section-content" style="max-width: 90vw;">
<!-- author -->
<div style="margin: 2em auto;">
<h3>作者</h3>
<div class="profile-div">
<div class="profile-cell">
<a href="https://github.com/krahets">
<img class="profile-img" src="assets/avatar/avatar_yudongjin.jpg" alt="Author: yudongjin" />
<br><b>靳宇栋(@krahets</b>
</a>
</div>
</div>
</div>
<!-- reviewers -->
<div style="margin: 2em auto;">
<h3>代码审阅者</h3>
<div class="profile-div">
<div class="profile-cell">
<a href="https://github.com/codingonion">
<img class="profile-img" src="assets/avatar/avatar_codingonion.jpg" alt="Reviewer: codingonion" />
<br><b>codingonion</b>
<br><sub>Zig, Rust</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/curtishd">
<img class="profile-img" src="assets/avatar/avatar_curtishd.jpg" alt="Reviewer: curtishd" />
<br><b>curtishd</b>
<br><sub>Kotlin</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/Gonglja">
<img class="profile-img" src="assets/avatar/avatar_Gonglja.jpg" alt="Reviewer: Gonglja" />
<br><b>Gonglja</b>
<br><sub>C, C++</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/gvenusleo">
<img class="profile-img" src="assets/avatar/avatar_gvenusleo.jpg" alt="Reviewer: gvenusleo" />
<br><b>gvenusleo</b>
<br><sub>Dart</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/hpstory">
<img class="profile-img" src="assets/avatar/avatar_hpstory.jpg" alt="Reviewer: hpstory" />
<br><b>hpstory</b>
<br><sub>C#</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/justin-tse">
<img class="profile-img" src="assets/avatar/avatar_justin-tse.jpg" alt="Reviewer: justin-tse" />
<br><b>justin-tse</b>
<br><sub>JS, TS</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/khoaxuantu">
<img class="profile-img" src="assets/avatar/avatar_khoaxuantu.jpg" alt="Reviewer: khoaxuantu" />
<br><b>khoaxuantu</b>
<br><sub>Ruby</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/krahets">
<img class="profile-img" src="assets/avatar/avatar_krahets.jpg" alt="Reviewer: krahets" />
<br><b>krahets</b>
<br><sub>Python, Java</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/night-cruise">
<img class="profile-img" src="assets/avatar/avatar_night-cruise.jpg" alt="Reviewer: night-cruise" />
<br><b>night-cruise</b>
<br><sub>Rust</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/nuomi1">
<img class="profile-img" src="assets/avatar/avatar_nuomi1.jpg" alt="Reviewer: nuomi1" />
<br><b>nuomi1</b>
<br><sub>Swift</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/Reanon">
<img class="profile-img" src="assets/avatar/avatar_Reanon.jpg" alt="Reviewer: Reanon" />
<br><b>Reanon</b>
<br><sub>Go, C</sub>
</a>
</div>
<div class="profile-cell">
<a href="https://github.com/rongyi">
<img class="profile-img" src="../assets/avatar/avatar_rongyi.jpg" alt="Reviewer: rongyi" />
<br><b>rongyi</b>
<br><sub>Rust</sub>
</a>
</div>
</div>
</div>
<!-- contributors -->
<div style="margin: 2em auto;">
<h3>贡献者</h3>
<p>本书在开源社区一百多位贡献者的共同努力下不断完善,感谢他们付出的时间与精力!</p>
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=16" alt="Contributors" style="width: 100%; max-width: 38.5em;">
</a>
</div>
</div>
</section>