将 README.md 图像显示条件更改为 GitHub 亮模式/暗模式

Question

是否可以更改 GitHub 中以 GitHub 的暗模式和亮模式为条件的 README.md 图像显示？也许我可以在 README.md 中放入一个简单的条件。

Answer 1

\xe2\x9a\xa0\xef\xb8\x8f 更新 - 2022 年 6 月 22 日

\n

\n

基于主题指定图像的旧方法，通过使用附加到 URL 的片段（#gh-dark-mode-only 或 #gh-light-mode-only），已被弃用并将被删除...... [来源]

\n

\n

\xe2\x9c\xa8 新方法

\n

<picture>\n  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/GiorgosXou/Random-stuff/main/Programming/StackOverflow/Answers/70200610_11465149/w.png">\n  <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/GiorgosXou/Random-stuff/main/Programming/StackOverflow/Answers/70200610_11465149/b.png">\n  <img alt="Shows a black logo in light color mode and a white one in dark color mode." src="https://user-images.githubusercontent.com/25423296/163456779-a8556205-d0a5-45e2-ac17-42d089e3c3f8.png">\n</picture>\n

\n

^ 来源| 示范| 更多信息

\n

\xe2\x9a\xa0\xef\xb8\x8f 老方法

\n

现在可以通过在所需的浅色\深色主题图像链接末尾使用以下关键字，有条件地指定根据主题显示什么图像。

\n

\n\n\n\n\n\n\n\n\n\n\n\n\n\n

#gh-dark-mode-only	#gh-light-mode-only

\n

^使用示例：

\n

<p align="center">\n    <img src="https://raw.githubusercontent.com/GiorgosXou/Random-stuff/main/Programming/StackOverflow/Answers/70200610_11465149/b.png#gh-light-mode-only" height="120" width="120"/>\n    <img src="https://raw.githubusercontent.com/GiorgosXou/Random-stuff/main/Programming/StackOverflow/Answers/70200610_11465149/w.png#gh-dark-mode-only" height="120" width="120"/>\n</p>\n

\n

![GitHub-Mark-Light](https://raw.githubusercontent.com/GiorgosXou/Random-stuff/main/Programming/StackOverflow/Answers/70200610_11465149/b.png#gh-light-mode-only)\n![GitHub-Mark-Dark ](https://raw.githubusercontent.com/GiorgosXou/Random-stuff/main/Programming/StackOverflow/Answers/70200610_11465149/w.png#gh-dark-mode-only)\n

\n

确保图像存储在 github 中，否则它们将不会根据主题动态显示。欲了解更多信息，请点击这里和这里

\n