Ce texte défile avec CSS ! ✨ ★★★ Texte défilant - Promotions exceptionnelles ! - 50% de réduction ce week-end ! ★★★
Défilement texte standard (gauche à droite) HTML / CSS
J'ai demandé a DeepSeek de me proposer un code pour remplacer l'ancien "marquee" Voici un exemple de code HTML/CSS moderne pour remplacer <marquee> : élément (obsolète) tout en étant accessible et personnalisable :
HTML
Code HTML à coller ou vous pouvez juste après <body>
<!-- Défilement standard (gauche à droite) -->
<div class="marquee">
<div class="marquee-content">
Ce texte défile avec CSS ! ✨
</div>
</div>
CSS
Le code CSS à coller dans votre feuille de styles
<style>
.marquee {
overflow: hidden;
white-space: nowrap;
width: 100%;
background: #f0f0f0;
}
.marquee-content {
display: inline-block;
padding-left: 100%;
animation: defilement 20s linear infinite;
}
.marquee-content:hover {
animation-play-state: paused;
}
@keyframes defilement {
0% { transform: translateX(0); }
100% { transform: translateX(-100%); }
}
</style>
Source : conversation avec DeepSeek, 31/01/2025
- Identifiez-vous pour poster des commentaires
