Maison >interface Web >tutoriel CSS >Comment ajouter du CSS personnalisé à votre GitHub README.md ?
Comment ajouter du CSS personnalisé à votre GitHub README.md ?
- Barbara Streisandoriginal
- 2024-11-03 21:48:02920parcourir
CSS personnalisé pour Readme.md dans GitHub Repos
Vérification du nom du fichier CSS qui modifie le fichier readme.md à la racine d'un dépôt GitHub est crucial lors de la personnalisation de l'apparence du dépôt. Même si certains pensent qu'il s'agit de .github/github.css, il se peut qu'il ne donne pas les résultats escomptés.
Au lieu de s'appuyer sur un fichier CSS dédié, une approche plus efficace consiste à intégrer HTML et CSS dans un fichier balise dans le fichier README de GitHub. Ceci peut être réalisé en utilisant un
Par exemple, pour créer une animation simple qui change la couleur du texte h1 :
<code class="css">h1 {
color: red;
animation: myanimation 2s infinite;
}
@keyframes myanimation {
from {
color: red;
}
to {
color: yellow;
}
}</code>
Et puis intégrez l'animation dans le 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>
Enfin, incluez le fichier SVG dans le README GitHub à l'aide d'un tag:
<img src="custom-animation.svg" alt="Animated text" />
Cette méthode fournit un moyen flexible et efficace de personnaliser l'apparence d'un fichier readme.md dans un dépôt GitHub, sans les limitations des fichiers CSS dédiés.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!