-
-
互助学习
-
+
+
+
+
+
提供网页版和 PDF 版，兼容 PC、平板和手机，随时随地阅读
+
-
欢迎讨论与提问读者间携手共进
-
-
-
-
"Knowledge increases by sharing."
-
“知识在分享中得以增长”
-
-
----
+
-
序
-
-两年前，我在力扣上分享了“剑指 Offer”系列题解，受到了许多同学的喜爱和支持。在与读者交流期间，我最常收到的一个问题是“如何入门算法”。逐渐地，我对这个问题产生了浓厚的兴趣。
-
-两眼一抹黑地刷题似乎是最受欢迎的方法，简单直接且有效。然而刷题就如同玩“扫雷”游戏，自学能力强的同学能够顺利将地雷逐个排掉，而基础不足的同学很可能被炸得满头是包，并在挫折中步步退缩。通读教材也是一种常见做法，但对于面向求职的同学来说，毕业季、投递简历、准备笔试面试已经消耗了大部分精力，啃厚重的书往往变成了一项艰巨的挑战。
-
-如果你也面临类似的困扰，那么很幸运这本书找到了你。本书是我对这个问题给出的答案，即使不是最优解，也至少是一次积极的尝试。本书虽然不足以让你直接拿到 Offer ，但会引导你探索数据结构与算法的“知识地图”，带你了解不同“地雷”的形状、大小和分布位置，让你掌握各种“排雷方法”。有了这些本领，相信你可以更加自如地刷题和阅读文献，逐步构建起完整的知识体系。
-
-我深深赞同费曼教授所言：“Knowledge isn't free. You have to pay attention.”从这个意义上看，这本书并非完全“免费”。为了不辜负你为本书所付出的宝贵“注意力”，我会尽我所能，投入最大的“注意力”来完成这本书的创作。
-
-
作者
+
+
+
+
推荐语
+
+
+
“一本通俗易懂的数据结构与算法入门书，引导读者手脑并用地学习，强烈推荐算法初学者阅读。”
+
—— 邓俊辉，清华大学计算机系教授
+
+
+
“如果我当年学数据结构与算法的时候有《Hello 算法》，学起来应该会简单 10 倍！”
+
—— 李沐，亚马逊资深首席科学家
+
+
+
-靳宇栋 ([Krahets](https://leetcode.cn/u/jyd/))，大厂高级算法工程师，上海交通大学硕士。力扣（LeetCode）全网阅读量最高博主，发表的[《图解算法数据结构》](https://leetcode.cn/leetbook/detail/illustration-of-algorithm/)已被订阅 30 万本。
+
+
+
+
+
+
+
+
内容清晰易懂，学习曲线平滑
+
"A picture is worth a thousand words."“一图胜千言”
+
+
+
+
----
+
+
+
+
+
+
十余种编程语言，代码可视化运行
+
"Talk is cheap. Show me the code."“少吹牛，看代码”
+
+
+
-
贡献
+
+
+
+
+
欢迎讨论与提问，读者间携手共进
+
"Knowledge increases by sharing."“知识在分享中得以增长”
+
+
+
+
-本书在开源社区众多贡献者的共同努力下不断完善。感谢每一位投入时间与精力的撰稿人，他们是（按照 GitHub 自动生成的顺序排列）：
+
-
-
- 
-
-
+
+
+
+
+
-本书的代码审阅工作由 codingonion、Gonglja、gvenusleo、hpstory、justin-tse、krahets、night-cruise、nuomi1 和 Reanon 完成（按照首字母顺序排列）。感谢他们付出的时间与精力，正是他们确保了各语言代码的规范与统一。
+
+
-
+
+
+
贡献者
+
本书在开源社区 130 多位贡献者的共同努力下不断完善，感谢他们付出的时间与精力！
+
+
+
+
+
\ No newline at end of file
diff --git a/overrides/assets/images/logo.png b/overrides/assets/images/logo.png
index 6fc6dab37..08b5970a9 100644
Binary files a/overrides/assets/images/logo.png and b/overrides/assets/images/logo.png differ
diff --git a/overrides/stylesheets/extra.css b/overrides/stylesheets/extra.css
index 332bf26bb..684c06bc9 100644
--- a/overrides/stylesheets/extra.css
+++ b/overrides/stylesheets/extra.css
@@ -112,6 +112,11 @@
text-transform: none;
}
+.md-typeset a:hover {
+ color: var(--md-typeset-a-color);
+ text-decoration: underline;
+}
+
.md-typeset code {
border-radius: 0.2rem;
}
@@ -150,34 +155,6 @@ body {
width: 100%; /* Default to full width */
}
-/* rounded button */
-.rounded-button {
- display: inline-flex; /* Use flexbox for alignment */
- align-items: center; /* Align items vertically */
- justify-content: center; /* Center items horizontally */
- border-radius: 100px; /* Circular corners */
- padding: 9px 18px; /* Padding around the text */
- margin: 0.15em 0;
- border: none; /* Removes default border */
- background-color: var(--md-typeset-btn-color); /* Background color */
- color: var(--md-primary-fg-color) !important; /* Text color */
- font-size: 0.85em; /* Font size */
- text-align: center; /* Center the text */
- text-decoration: none; /* Remove underline from anchor text */
- cursor: pointer; /* Pointer cursor on hover */
-}
-
-.rounded-button:hover {
- background-color: var(--md-typeset-btn-hover-color);
-}
-
-.rounded-button svg {
- fill: var(--md-primary-fg-color); /* Fill SVG icon with text color */
- width: 1.2em;
- height: auto;
- margin-right: 0.5em; /* Add some space between the SVG icon and the text */
-}
-
/* Admonition for python tutor */
.md-typeset .admonition.pythontutor,
.md-typeset details.pythontutor {
@@ -216,3 +193,272 @@ body {
transform-origin: top left;
border: none;
}
+
+/* landing page container */
+.home-div {
+ width: 100%;
+ height: auto;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ background-color: var(--md-default-bg-color);
+ color: var(--md-default-fg-color);
+ font-size: 0.9rem;
+ padding: 2em;
+ text-align: center;
+}
+
+.section-content {
+ width: 100%;
+ height: auto;
+ max-width: 70vw;
+}
+
+/* rounded button */
+.rounded-button {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 10em;
+ margin: 0 0.1em;
+ padding: 0.5em 1.3em;
+ border: none;
+ background-color: var(--md-typeset-btn-color);
+ color: var(--md-primary-fg-color) !important;
+ text-align: center;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+.rounded-button:hover {
+ background-color: var(--md-typeset-btn-hover-color);
+}
+
+.rounded-button p {
+ margin: 0;
+ margin-bottom: 0.1em;
+}
+
+.rounded-button svg {
+ fill: var(--md-primary-fg-color);
+ width: auto;
+ height: 1.2em;
+ margin-right: 0.5em;
+}
+
+/* text button */
+.text-button-container {
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ height: auto;
+ margin: 0 auto;
+}
+
+.text-button {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ color: var(--md-typeset-btn-color);
+ text-decoration: none;
+ margin: 0 1em;
+}
+
+.text-button:hover {
+ text-decoration: underline;
+}
+
+.text-button svg {
+ display: inline-block;
+ fill: var(--md-typeset-btn-color);
+ width: auto;
+ height: 0.9em;
+ background-size: cover;
+ padding-top: 0.17em;
+ margin-left: 0.4em;
+}
+
+/* hero image */
+.hero-image-div {
+ height: min(84vh, 75vw);
+ width: min(112vh, 100vw);
+ margin: 0 auto;
+ margin-top: -2.4rem;
+ padding: 0;
+ position: relative;
+ color: white;
+ font-size: min(2vh, 2.5vw);
+ font-weight: 500;
+}
+
+.hero-bg {
+ height: 100%;
+ width: 100%;
+ object-fit: cover;
+ position: absolute;
+}
+
+/* hover on the planets */
+.hero-on-hover {
+ width: auto;
+ position: absolute;
+ transition: transform 0.3s ease-in-out, filter 0.3s ease-in-out;
+}
+
+.hero-caption {
+ margin: 0;
+ position: absolute;
+ transform: translateX(-50%) translateY(-50%);
+ white-space: nowrap; /* prevent line breaks */
+}
+
+a:hover .hero-on-hover {
+ filter: brightness(1.15) saturate(1.1)
+ drop-shadow(0 0 0.5rem rgba(255, 255, 255, 0.2));
+ transform: scale(1.03);
+}
+
+a:hover .hero-caption {
+ text-decoration: underline;
+ color: var(--md-typeset-btn-color);
+}
+
+/* code badge */
+.code-badge {
+ width: 100%;
+ height: auto;
+ margin: 0 auto;
+}
+
+.code-badge img {
+ height: 1.07em;
+ width: auto;
+}
+
+/* device */
+.device-on-hover {
+ width: auto;
+ position: absolute;
+ transition: transform 0.3s ease-in-out, filter 0.3s ease-in-out;
+}
+
+.device-on-hover:hover {
+ filter: drop-shadow(0 0 0.2rem rgba(0, 0, 0, 0.15));
+ transform: scale(1.03);
+}
+
+/* brief intro */
+.intro-container {
+ display: flex;
+ align-items: center;
+ margin: 2em auto;
+}
+
+.intro-image {
+ flex-shrink: 0;
+ flex-grow: 0;
+ width: 55%;
+ border-radius: 0.5em;
+ box-shadow: var(--md-shadow-z2);
+}
+
+.intro-text {
+ flex-grow: 1; /* fill the space */
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ text-align: left;
+ align-items: flex-start;
+ width: fit-content;
+ margin: 2em;
+}
+
+.intro-text > div {
+ align-self: flex-start;
+ width: auto;
+ margin: 0 auto;
+}
+
+.endor-text {
+ width: 50%;
+}
+
+.intro-quote {
+ color: var(--md-accent-fg-color);
+ font-weight: bold;
+}
+
+/* contributors table */
+.profile-div {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ max-width: 720px;
+ margin: 1em auto;
+}
+
+.profile-cell {
+ flex: 1; /* even distribution */
+ flex-basis: 15%;
+ margin: 1em 0.5em;
+ text-align: center;
+}
+
+.profile-img {
+ width: 5em;
+ border-radius: 50%;
+ margin-bottom: 0.5em;
+}
+
+.giscus-container {
+ width: 50em;
+ max-width: 100%;
+ margin: 0 auto;
+}
+
+/* Hide table of contents */
+@media screen and (max-width: 60em) {
+ .home-div {
+ font-size: 0.75rem;
+ }
+}
+
+/* Hide navigation */
+@media screen and (max-width: 76.25em) {
+ .section-content {
+ max-width: 95vw;
+ }
+
+ .intro-container {
+ flex-direction: column;
+ }
+
+ .intro-text {
+ width: auto;
+ order: 2;
+ margin: 0 auto;
+ }
+
+ .endor-text {
+ width: auto;
+ margin: 0 auto;
+ }
+
+ .intro-image {
+ width: 100%;
+ order: 1;
+ margin-bottom: 1em;
+ }
+
+ .contrib-image {
+ width: 100%;
+ }
+
+ .profile-div {
+ max-width: 500px;
+ }
+ .profile-cell {
+ flex-basis: 25%;
+ }
+}
-
- 
- 
- 
-
-
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+