Scribd
Importer
15 vues1 page

Style CSS pour éléments en bloc

Ce document contient des styles CSS pour un élément avec la classe '.pi'. Il définit des propriétés telles que l'affichage en bloc, la mise en forme du texte, un dégradé de fond, et des effets de transition au survol. Les styles visent à améliorer l'esthétique et la lisibilité de l'élément.

Transféré par

rj260923
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats TXT, PDF, TXT ou lisez en ligne sur Scribd
15 vues1 page

Style CSS pour éléments en bloc

Ce document contient des styles CSS pour un élément avec la classe '.pi'. Il définit des propriétés telles que l'affichage en bloc, la mise en forme du texte, un dégradé de fond, et des effets de transition au survol. Les styles visent à améliorer l'esthétique et la lisibilité de l'élément.

Transféré par

rj260923
Copyright
© All Rights Reserved
Nous prenons très au sérieux les droits relatifs au contenu. Si vous pensez qu’il s’agit de votre contenu, signalez une atteinte au droit d’auteur ici.
Formats disponibles
Téléchargez aux formats TXT, PDF, TXT ou lisez en ligne sur Scribd

.

pi {
display: block; /* s'affiche en bloc */
margin: 10px auto; /* espace autour + centré */
padding: 12px 18px; /* respiration du texte */
max-width: 600px; /* limite la largeur */
font-family: "Segoe UI", Arial, sans-serif;
font-size: 18px;
line-height: 1.6; /* bonne lisibilité */
color: #f0f0f0; /* texte clair */
background: linear-gradient(135deg, #1e3c72, #2a5298); /* dégradé bleu */
border-radius: 12px; /* coins arrondis */
box-shadow: 0 4px 12px rgba(0,0,0,0.2); /* ombre douce */
white-space: pre-line; /* interprète les "\n" comme vrais sauts de ligne */
text-align: left; /* texte aligné à gauche */
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pi:hover {
transform: translateY(-3px); /* petit effet flottant */
box-shadow: 0 6px 18px rgba(0,0,0,0.3);
}

Vous aimerez peut-être aussi