Basculer le menu
Changer de menu des préférences
Basculer le menu personnel
Non connecté(e)
Votre adresse IP sera visible au public si vous faites des modifications.

« Modèle:Police/styles.css » : différence entre les versions

De Nefald
Hiob (discussion | contributions)
m Hiob a déplacé la page Modèle:Font/styles.css vers Modèle:Police/styles.css sans laisser de redirection
Hiob (discussion | contributions)
Aucun résumé des modifications
Ligne 1 : Ligne 1 :
/* ==== Modèle:Font - Styles de coloration de texte ==== */
/* ==== Modèle:Police - Styles de texte avancés ==== */


/* === Couleurs de base === */
/* === Couleurs de base === */
.font-color {
.police-color {
     display: inline;
     display: inline;
}
}


.font-rouge { color: #dc3545; }
.police-rouge { color: #dc3545; }
.font-bleu { color: #0d6efd; }
.police-bleu { color: #0d6efd; }
.font-vert { color: #198754; }
.police-vert { color: #198754; }
.font-jaune { color: #ffc107; }
.police-jaune { color: #ffc107; }
.font-orange { color: #fd7e14; }
.police-orange { color: #fd7e14; }
.font-violet { color: #6f42c1; }
.police-violet { color: #6f42c1; }
.font-rose { color: #d63384; }
.police-rose { color: #d63384; }
.font-cyan { color: #0dcaf0; }
.police-cyan { color: #0dcaf0; }
.font-blanc { color: #ffffff; }
.police-blanc { color: #ffffff; }
.font-gris { color: #6c757d; }
.police-gris { color: #6c757d; }
.font-noir { color: #000000; }
.police-noir { color: #000000; }
.police-or { color: #ffd700; }
.police-argent { color: #c0c0c0; }
.police-bronze { color: #cd7f32; }


/* Couleurs métalliques */
/* === FAMILLES DE POLICES === */
.font-or { color: #ffd700; }
.font-argent { color: #c0c0c0; }
.font-bronze { color: #cd7f32; }


/* === EFFETS AMÉLIORÉS === */
.police-famille-serif {
    font-family: Georgia, "Times New Roman", serif;
}
 
.police-famille-sans {
    font-family: Arial, Helvetica, sans-serif;
}
 
.police-famille-mono {
    font-family: "Courier New", Courier, monospace;
}
 
.police-famille-cursive {
    font-family: "Brush Script MT", cursive;
}
 
.police-famille-fantasy {
    font-family: "Comic Sans MS", "Chalkboard SE", fantasy;
}
 
.police-famille-impact {
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
}
 
.police-famille-gothic {
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
}
 
.police-famille-palatino {
    font-family: Palatino, "Palatino Linotype", "Book Antiqua", serif;
}
 
.police-famille-garamond {
    font-family: Garamond, Baskerville, "Baskerville Old Face", serif;
}
 
.police-famille-verdana {
    font-family: Verdana, Geneva, sans-serif;
}
 
.police-famille-trebuchet {
    font-family: "Trebuchet MS", "Lucida Grande", sans-serif;
}
 
.police-famille-times {
    font-family: "Times New Roman", Times, serif;
}
 
/* === EFFETS VISUELS === */


/* Effet brillant - GLOW PUISSANT */
/* Effet brillant - GLOW PUISSANT */
.font-effet-brillant {
.police-effet-brillant {
     text-shadow:  
     text-shadow:  
         0 0 10px currentColor,
         0 0 10px currentColor,
Ligne 38 : Ligne 86 :


/* Effet néon - ULTRA VISIBLE */
/* Effet néon - ULTRA VISIBLE */
.font-effet-neon {
.police-effet-neon {
     text-shadow:  
     text-shadow:  
         0 0 5px #fff,
         0 0 5px #fff,
Ligne 53 : Ligne 101 :


/* Effet ombre portée - MARQUÉE */
/* Effet ombre portée - MARQUÉE */
.font-effet-ombre {
.police-effet-ombre {
     text-shadow:  
     text-shadow:  
         3px 3px 0 rgba(0, 0, 0, 0.3),
         3px 3px 0 rgba(0, 0, 0, 0.3),
Ligne 62 : Ligne 110 :


/* Effet 3D - PROFONDEUR EXTRÊME */
/* Effet 3D - PROFONDEUR EXTRÊME */
.font-effet-3d {
.police-effet-3d {
     text-shadow:  
     text-shadow:  
         1px 1px 0 rgba(0, 0, 0, 0.3),
         1px 1px 0 rgba(0, 0, 0, 0.3),
Ligne 77 : Ligne 125 :


/* Effet relief - GRAVURE PROFONDE */
/* Effet relief - GRAVURE PROFONDE */
.font-effet-relief {
.police-effet-relief {
     text-shadow:  
     text-shadow:  
         2px 2px 0 rgba(255, 255, 255, 0.8),
         2px 2px 0 rgba(255, 255, 255, 0.8),
Ligne 86 : Ligne 134 :


/* Effet contour - STROKE ÉPAIS */
/* Effet contour - STROKE ÉPAIS */
.font-effet-contour {
.police-effet-contour {
     text-shadow:  
     text-shadow:  
         -2px -2px 0 #000,
         -2px -2px 0 #000,
Ligne 101 : Ligne 149 :


/* Effet pulsation - ANIMATION VISIBLE */
/* Effet pulsation - ANIMATION VISIBLE */
.font-effet-pulse {
.police-effet-pulse {
     animation: font-pulse 1.5s ease-in-out infinite;
     animation: police-pulse 1.5s ease-in-out infinite;
     font-weight: bold;
     font-weight: bold;
}
}


@keyframes font-pulse {
@keyframes police-pulse {
     0%, 100% {  
     0%, 100% {  
         opacity: 1;  
         opacity: 1;  
Ligne 120 : Ligne 168 :


/* Effet clignotant */
/* Effet clignotant */
.font-effet-clignotant {
.police-effet-clignotant {
     animation: font-blink 1s step-start infinite;
     animation: police-blink 1s step-start infinite;
     font-weight: bold;
     font-weight: bold;
}
}


@keyframes font-blink {
@keyframes police-blink {
     0%, 49% { opacity: 1; }
     0%, 49% { opacity: 1; }
     50%, 100% { opacity: 0; }
     50%, 100% { opacity: 0; }
Ligne 131 : Ligne 179 :


/* Effet gras */
/* Effet gras */
.font-effet-gras {
.police-effet-gras {
     font-weight: 900;
     font-weight: 900;
     letter-spacing: 1px;
     letter-spacing: 1px;
Ligne 137 : Ligne 185 :


/* Effet métallique OR - BRILLANCE INTENSE */
/* Effet métallique OR - BRILLANCE INTENSE */
.font-or.font-effet-metallique {
.police-or.police-effet-metallique {
     color: #ffd700;
     color: #ffd700;
     text-shadow:  
     text-shadow:  
Ligne 157 : Ligne 205 :


/* Effet métallique ARGENT */
/* Effet métallique ARGENT */
.font-argent.font-effet-metallique {
.police-argent.police-effet-metallique {
     color: #e8e8e8;
     color: #e8e8e8;
     text-shadow:  
     text-shadow:  
Ligne 176 : Ligne 224 :


/* Effet métallique BRONZE */
/* Effet métallique BRONZE */
.font-bronze.font-effet-metallique {
.police-bronze.police-effet-metallique {
     color: #e8a75c;
     color: #e8a75c;
     text-shadow:  
     text-shadow:  
Ligne 195 : Ligne 243 :


/* Effet FEU - FLAMMES ANIMÉES */
/* Effet FEU - FLAMMES ANIMÉES */
.font-effet-feu {
.police-effet-feu {
     color: #ff4500;
     color: #ff4500;
     text-shadow:  
     text-shadow:  
Ligne 204 : Ligne 252 :
         0 0 50px #ff7f00,
         0 0 50px #ff7f00,
         0 0 60px #ffff00;
         0 0 60px #ffff00;
     animation: font-fire 0.5s ease-in-out infinite alternate;
     animation: police-fire 0.5s ease-in-out infinite alternate;
     font-weight: bold;
     font-weight: bold;
     letter-spacing: 2px;
     letter-spacing: 2px;
}
}


@keyframes font-fire {
@keyframes police-fire {
     0% {  
     0% {  
         text-shadow:  
         text-shadow:  
Ligne 235 : Ligne 283 :


/* Effet GLACE - CRISTAUX GLACÉS */
/* Effet GLACE - CRISTAUX GLACÉS */
.font-effet-glace {
.police-effet-glace {
     color: #00ffff;
     color: #00ffff;
     text-shadow:  
     text-shadow:  
Ligne 250 : Ligne 298 :


/* Effet RAINBOW multicolore */
/* Effet RAINBOW multicolore */
.font-effet-rainbow {
.police-effet-rainbow {
     animation: font-rainbow 3s linear infinite;
     animation: police-rainbow 3s linear infinite;
     font-weight: bold;
     font-weight: bold;
     letter-spacing: 2px;
     letter-spacing: 2px;
Ligne 259 : Ligne 307 :
}
}


@keyframes font-rainbow {
@keyframes police-rainbow {
     0% { color: #ff0000; text-shadow: 0 0 20px #ff0000; }
     0% { color: #ff0000; text-shadow: 0 0 20px #ff0000; }
     16% { color: #ff7f00; text-shadow: 0 0 20px #ff7f00; }
     16% { color: #ff7f00; text-shadow: 0 0 20px #ff7f00; }
Ligne 270 : Ligne 318 :


/* Effet dégradé avec glow */
/* Effet dégradé avec glow */
.font-effet-degrade {
.police-effet-degrade {
     text-shadow:  
     text-shadow:  
         0 0 5px currentColor,
         0 0 5px currentColor,
Les témoins (''cookies'') nous aident à fournir nos services. En utilisant nos services, vous acceptez notre utilisation de témoins.