Mettre en valeur un texte en l'encadrant
Page 1 sur 1•Partagez
- Splash
StaffAdmin - Code:
p.encadrement {
background:#dbe0ef;
border:1px dotted black;
border-radius: 5px;
padding:10px;
}- Code:
<p class="encadrement">[b]Le passage de Lorem Ipsum standard, utilisé depuis 1500[/b]
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."</p>- Code:
border:1px dotted black;
![Splash](https://2img.net/u/4012/75/45/07/avatars/1-77.gif)
Hi,
Voici une petite astuce qui pourra vous servir pour agrémenter vos textes.
Pour cette astuce il faut que le HTML soit activé sur le forum et dans le profil
Premièrement il faut créer une class que l'on va nommer encadrement
Ensuite pour la décoration on va jouer sur :
- Une couleur de fond (background)
- Une épaisseur pour la bordure du cadre (border)
- On défini comment est ce cadre et de quelle couleur*
- On ajoute des coins arrondis à ce cadre (border-radius)
- On joue sur l'espace entre le texte et le cadre (padding)
Direction la feuille de style CSS
Panneau d'administration / Affichage / Images et Couleurs / Couleurs / Feuille de style CSS
Mettre ce code :
Pour encadrer votre texte il faut l'écrire entre des balises :
Ce qui donnera à l'écran :
*Cette ligne de code :
Elle définie que le cadre à une bordure de 1px, qu'il est en pointillé et de couleur noire
Style de bordures :
Huit styles sont possibles :
- dotted (pointillé)
- dashed (tirets)
- solid (solide)
- double (double)
- groove (rainurée)
- ridge (relief)
- inset (relief intérieur)
- outset (relief extérieur)
À bientôt
Voici une petite astuce qui pourra vous servir pour agrémenter vos textes.
Pour cette astuce il faut que le HTML soit activé sur le forum et dans le profil
Premièrement il faut créer une class que l'on va nommer encadrement
Ensuite pour la décoration on va jouer sur :
- Une couleur de fond (background)
- Une épaisseur pour la bordure du cadre (border)
- On défini comment est ce cadre et de quelle couleur*
- On ajoute des coins arrondis à ce cadre (border-radius)
- On joue sur l'espace entre le texte et le cadre (padding)
Direction la feuille de style CSS
Panneau d'administration / Affichage / Images et Couleurs / Couleurs / Feuille de style CSS
Mettre ce code :
Pour encadrer votre texte il faut l'écrire entre des balises :
Ce qui donnera à l'écran :
Le passage de Lorem Ipsum standard, utilisé depuis 1500
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
*Cette ligne de code :
Elle définie que le cadre à une bordure de 1px, qu'il est en pointillé et de couleur noire
Style de bordures :
Huit styles sont possibles :
- dotted (pointillé)
- dashed (tirets)
- solid (solide)
- double (double)
- groove (rainurée)
- ridge (relief)
- inset (relief intérieur)
- outset (relief extérieur)
À bientôt
- LilaCH
Membre
![LilaCH](https://2img.net/u/4012/75/45/07/avatars/4-26.png)
Merci beaucoup !
- chrisnvidia
Membre
![chrisnvidia](https://2img.net/u/4012/75/45/07/avatars/10-38.png)
Merci beaucoup !
- Passiflore
Membre
![Passiflore](https://2img.net/u/4012/75/45/07/avatars/9-86.jpg)
Merci beaucoup !
- Lilas
Membre
![Lilas](https://2img.net/u/4012/75/45/07/avatars/20-55.jpg)
Trop joli. Merci Splash.
![Mettre en valeur un texte en l'encadrant 2733](https://2img.net/i/fa/twemoji/16x16/2733.png)
![Mettre en valeur un texte en l'encadrant 2733](https://2img.net/i/fa/twemoji/16x16/2733.png)
![Mettre en valeur un texte en l'encadrant 2733](https://2img.net/i/fa/twemoji/16x16/2733.png)
![Mettre en valeur un texte en l'encadrant 2733](https://2img.net/i/fa/twemoji/16x16/2733.png)
Sujets les plus actifs
Sujets les plus vus
Meilleurs posteurs
» » Bouton MP "Répondre" adapté à la version ModernBB
» » Réduire la hauteur des catégories
» » [AwesomeBB] Ajout d'un bloc de connexion/enregistrement en bas de page
» » Afficher les avatars en forme rectangulaire
» » Modifier la partie des stats en début de qeel
» » Mettre une image au qeel
» » Rendre l'image du header cliquable
» » Elargir le cadre de la boite de smileys
» » [phpBB3] Flèches Haut et Bas qui s'adaptent à la couleur du thème
» » Catégories rétractables sur l'index
» » [phpBB3] Catégories de différentes couleurs
» » [phpBB3] Ajout d'un bloc de connexion/enregistrement en bas de page
» » Centrer l'avatar, le pseudo & le rang dans les messages
» » Modifier l'icône "On-line"