GitHub readme 페이지에 다크/라이트 모드 관련 이미지 추가

최근에 우리는 오픈 소스 프로젝트Novu의 새 로고 디자인을 마쳤으며 GitHub 문서에서 .md src 소스 접미사에 #gh-dark-mode-only를 사용하여 밝은 모드와 어두운 모드에 대한 이미지를 개별적으로 지정할 수 있음을 발견했습니다.

다음은 예입니다.

![Logo Dark](https://image-link.png#gh-dark-mode-only)
![Logo Light](https://image-link.png#gh-light-mode-only)


사용자 테마 기본 설정에 따라 단일 이미지만 표시됩니다. 실제로 작동하는 것을 봅시다:

라이트 모드





다크 모드





이미지 중앙에 맞추기



작은 이미지를 화면 중앙에 맞추는 것이 일반적입니다. 다행스럽게도 지원되는 align="center" 태그에서 div 속성을 사용할 수 있습니다.


<div align="center">

  ![Logo Dark](https://user-images.githubusercontent.com/8872447/165779319-34962ccc-3149-466c-b1da-97fd93254520.png#gh-dark-mode-only)

</div>

<div align="center">

  ![Logo Light](https://user-images.githubusercontent.com/8872447/165779274-22a190da-3284-487e-bd1e-14983df12cbb.png#gh-light-mode-only)

</div>


The new lines after the starting and before closing of the div are important, otherwise the image won't be rendered.



새로운 테마 일치 로고가 멋지고 GitHub 개인 또는 오픈 소스 프로젝트 추가 정보를 돋보이게 만드는 또 다른 세부 사항이라고 생각합니다.

댓글에 결과를 게시하세요!

좋은 웹페이지 즐겨찾기