>웹 프론트엔드 >CSS 튜토리얼 >GitHub README.md에 사용자 정의 CSS를 추가하는 방법은 무엇입니까?

GitHub README.md에 사용자 정의 CSS를 추가하는 방법은 무엇입니까?

Barbara Streisand
Barbara Streisand원래의
2024-11-03 21:48:02881검색

How to Add Custom CSS to Your GitHub README.md?

GitHub Repos의 Readme.md용 사용자 정의 CSS

루트에서 readme.md 파일을 수정하는 CSS 파일 이름 확인 GitHub 저장소의 모양은 저장소의 모양을 사용자 정의할 때 매우 중요합니다. 일부에서는 .github/github.css라고 생각하지만 예상한 결과를 얻지 못할 수도 있습니다.

전용 CSS 파일에 의존하는 대신 GitHub README에 태그를 추가하세요. 이는 HTML과 CSS 코드를 모두 지원하는 태그입니다.

예를 들어 h1 텍스트의 색상을 변경하는 간단한 애니메이션을 만들려면 다음을 수행하세요.

<code class="css">h1 {
  color: red;
  animation: myanimation 2s infinite;
}

@keyframes myanimation {
  from {
    color: red;
  }
  to {
    color: yellow;
  }
}</code>

그런 다음 SVG 내에 애니메이션을 삽입하세요. file:

<code class="html"><svg width="100%" height="100%">
  <foreignObject width="100%" height="100%">
    <html>
      <head>
        <style>
          <!-- Code from above -->
        </style>
      </head>
      <body>
        <h1>Hello world!</h1>
      </body>
    </html>
  </foreignObject>
</svg></code>

마지막으로 태그:

<img src="custom-animation.svg" alt="Animated text" />

이 방법은 전용 CSS 파일의 제한 없이 GitHub 저장소에 있는 readme.md 파일의 모양을 사용자 정의하는 유연하고 효율적인 방법을 제공합니다.

위 내용은 GitHub README.md에 사용자 정의 CSS를 추가하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.