« Modèle:Police/styles.css » : différence entre les versions
De Nefald
Autres actions
Aucun résumé des modifications |
m Fette Unz Fraktur |
||
| Ligne 45 : | Ligne 45 : | ||
.police-famille-impact { | .police-famille-impact { | ||
font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; | font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; | ||
} | |||
.police-famille-fraktur { | |||
font-family: "Fette Unz Fraktur", Fette Unz Fraktur, AppleGothic, sans-serif; | |||
} | |||
.police-famille-fraktur-classic { | |||
font-family: "Fette Unz Fraktur Classic", Fette Unz Fraktur Classic, AppleGothic, sans-serif; | |||
} | } | ||
Dernière version du 13 novembre 2025 à 06:54
/* ==== Modèle:Police - Styles de texte avancés ==== */
/* === Couleurs de base === */
.police-color {
display: inline;
}
.police-rouge { color: #dc3545; }
.police-bleu { color: #0d6efd; }
.police-vert { color: #198754; }
.police-jaune { color: #ffc107; }
.police-orange { color: #fd7e14; }
.police-violet { color: #6f42c1; }
.police-rose { color: #d63384; }
.police-cyan { color: #0dcaf0; }
.police-blanc { color: #ffffff; }
.police-gris { color: #6c757d; }
.police-noir { color: #000000; }
.police-or { color: #ffd700; }
.police-argent { color: #c0c0c0; }
.police-bronze { color: #cd7f32; }
/* === FAMILLES DE POLICES === */
.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-fraktur {
font-family: "Fette Unz Fraktur", Fette Unz Fraktur, AppleGothic, sans-serif;
}
.police-famille-fraktur-classic {
font-family: "Fette Unz Fraktur Classic", Fette Unz Fraktur Classic, AppleGothic, 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 */
.police-effet-brillant {
text-shadow:
0 0 10px currentColor,
0 0 20px currentColor,
0 0 30px currentColor,
0 0 40px currentColor,
0 0 50px currentColor;
font-weight: bold;
letter-spacing: 1px;
}
/* Effet néon - ULTRA VISIBLE */
.police-effet-neon {
text-shadow:
0 0 5px #fff,
0 0 10px #fff,
0 0 15px currentColor,
0 0 20px currentColor,
0 0 30px currentColor,
0 0 40px currentColor,
0 0 50px currentColor,
0 0 60px currentColor;
font-weight: bold;
letter-spacing: 2px;
}
/* Effet ombre portée - MARQUÉE */
.police-effet-ombre {
text-shadow:
3px 3px 0 rgba(0, 0, 0, 0.3),
6px 6px 0 rgba(0, 0, 0, 0.2),
9px 9px 0 rgba(0, 0, 0, 0.1);
font-weight: bold;
}
/* Effet 3D - PROFONDEUR EXTRÊME */
.police-effet-3d {
text-shadow:
1px 1px 0 rgba(0, 0, 0, 0.3),
2px 2px 0 rgba(0, 0, 0, 0.3),
3px 3px 0 rgba(0, 0, 0, 0.3),
4px 4px 0 rgba(0, 0, 0, 0.3),
5px 5px 0 rgba(0, 0, 0, 0.3),
6px 6px 0 rgba(0, 0, 0, 0.3),
7px 7px 0 rgba(0, 0, 0, 0.3),
8px 8px 10px rgba(0, 0, 0, 0.5);
font-weight: bold;
letter-spacing: 1px;
}
/* Effet relief - GRAVURE PROFONDE */
.police-effet-relief {
text-shadow:
2px 2px 0 rgba(255, 255, 255, 0.8),
-2px -2px 0 rgba(0, 0, 0, 0.6),
0 0 5px rgba(0, 0, 0, 0.5);
font-weight: bold;
}
/* Effet contour - STROKE ÉPAIS */
.police-effet-contour {
text-shadow:
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000,
-3px 0 0 #000,
3px 0 0 #000,
0 -3px 0 #000,
0 3px 0 #000;
font-weight: bold;
letter-spacing: 1px;
}
/* Effet pulsation - ANIMATION VISIBLE */
.police-effet-pulse {
animation: police-pulse 1.5s ease-in-out infinite;
font-weight: bold;
}
@keyframes police-pulse {
0%, 100% {
opacity: 1;
transform: scale(1);
text-shadow: 0 0 10px currentColor;
}
50% {
opacity: 0.6;
transform: scale(1.1);
text-shadow: 0 0 30px currentColor;
}
}
/* Effet clignotant */
.police-effet-clignotant {
animation: police-blink 1s step-start infinite;
font-weight: bold;
}
@keyframes police-blink {
0%, 49% { opacity: 1; }
50%, 100% { opacity: 0; }
}
/* Effet gras */
.police-effet-gras {
font-weight: 900;
letter-spacing: 1px;
}
/* Effet métallique OR - BRILLANCE INTENSE */
.police-or.police-effet-metallique {
color: #ffd700;
text-shadow:
-1px -1px 0 #b8860b,
1px -1px 0 #b8860b,
-1px 1px 0 #b8860b,
1px 1px 0 #b8860b,
-2px -2px 0 #8b6914,
2px -2px 0 #8b6914,
-2px 2px 0 #8b6914,
2px 2px 0 #8b6914,
0 0 5px #ffd700,
0 0 10px #ffd700,
0 0 15px #ffed4e,
0 0 20px #ffed4e;
font-weight: bold;
letter-spacing: 2px;
}
/* Effet métallique ARGENT */
.police-argent.police-effet-metallique {
color: #e8e8e8;
text-shadow:
-1px -1px 0 #808080,
1px -1px 0 #808080,
-1px 1px 0 #808080,
1px 1px 0 #808080,
-2px -2px 0 #606060,
2px -2px 0 #606060,
-2px 2px 0 #606060,
2px 2px 0 #606060,
0 0 5px #fff,
0 0 10px #fff,
0 0 15px #c0c0c0;
font-weight: bold;
letter-spacing: 2px;
}
/* Effet métallique BRONZE */
.police-bronze.police-effet-metallique {
color: #e8a75c;
text-shadow:
-1px -1px 0 #8b5a2b,
1px -1px 0 #8b5a2b,
-1px 1px 0 #8b5a2b,
1px 1px 0 #8b5a2b,
-2px -2px 0 #654321,
2px -2px 0 #654321,
-2px 2px 0 #654321,
2px 2px 0 #654321,
0 0 5px #cd7f32,
0 0 10px #cd7f32,
0 0 15px #e8a75c;
font-weight: bold;
letter-spacing: 2px;
}
/* Effet FEU - FLAMMES ANIMÉES */
.police-effet-feu {
color: #ff4500;
text-shadow:
0 0 10px #ff0000,
0 0 20px #ff0000,
0 0 30px #ff4500,
0 0 40px #ff7f00,
0 0 50px #ff7f00,
0 0 60px #ffff00;
animation: police-fire 0.5s ease-in-out infinite alternate;
font-weight: bold;
letter-spacing: 2px;
}
@keyframes police-fire {
0% {
text-shadow:
0 0 10px #ff0000,
0 0 20px #ff0000,
0 0 30px #ff4500,
0 0 40px #ff7f00;
}
50% {
text-shadow:
0 0 15px #ff0000,
0 0 25px #ff4500,
0 0 35px #ff7f00,
0 0 45px #ffff00;
}
100% {
text-shadow:
0 0 20px #ff0000,
0 0 30px #ff4500,
0 0 40px #ff7f00,
0 0 50px #ffff00,
0 0 60px #ffff00;
}
}
/* Effet GLACE - CRISTAUX GLACÉS */
.police-effet-glace {
color: #00ffff;
text-shadow:
0 0 5px #ffffff,
0 0 10px #ffffff,
0 0 15px #00ffff,
0 0 20px #00ffff,
0 0 30px #00ffff,
0 0 40px #0099ff,
0 0 50px #0099ff;
font-weight: bold;
letter-spacing: 3px;
}
/* Effet RAINBOW multicolore */
.police-effet-rainbow {
animation: police-rainbow 3s linear infinite;
font-weight: bold;
letter-spacing: 2px;
text-shadow:
0 0 10px currentColor,
0 0 20px currentColor;
}
@keyframes police-rainbow {
0% { color: #ff0000; text-shadow: 0 0 20px #ff0000; }
16% { color: #ff7f00; text-shadow: 0 0 20px #ff7f00; }
33% { color: #ffff00; text-shadow: 0 0 20px #ffff00; }
50% { color: #00ff00; text-shadow: 0 0 20px #00ff00; }
66% { color: #0000ff; text-shadow: 0 0 20px #0000ff; }
83% { color: #4b0082; text-shadow: 0 0 20px #4b0082; }
100% { color: #ff0000; text-shadow: 0 0 20px #ff0000; }
}
/* Effet dégradé avec glow */
.police-effet-degrade {
text-shadow:
0 0 5px currentColor,
0 0 10px currentColor,
0 0 15px currentColor,
2px 2px 5px rgba(0, 0, 0, 0.3);
font-weight: bold;
letter-spacing: 1px;
}