exte bienvenue

Sorcière Corbeau, la fée des astuces. Découvrez les secrets de mon univers !

Encadrement de texte dans votre message d'article

C'EST ICI QUE VOUS AJOUTEZ LE CODE BORDURE AVEC LE FOND , SI VOUS EN VOULEZ ENCORE UN AUTRE SAUTÉ UNE LIGNE ET AJOUTER LE MEME CODE EXEMPLE

Vous êtes plusieurs a me demander comment faire un encadrement avec un fond. Je vais pas tous vous donnez mais vous aurez tous les outils de base pour creez vous même vos propres modeles personalisable.   en ajouter des ombres, des boutons, des images, des liens cliquables des menus etc...


Copier le Code et allez le coller pour crée votre modele. 

---- CODE ENCADREMENT SMPLE ET FACILE ----

<div style="padding: 10px;">

<div style="background-color: #63c9d1; border-radius: 2px; border:20px double; padding: 26px; width: auto;">


Encadrement de texte de base en  html dans votre message d'article 
---------------------------------------CODE HTML------------------------------------------------------
Coller le code du haut dans Le code  PAGE/NOUVEAU ouMESSAGE/NOUVEAU cliquez sur la petite fleche comme montre la capture en-bas 

Sivous voulez plus de cadre et fond vous ajoutez le code (voir juste en-bas)
-------CODE------------------ AJOUT BORDURE + FOND ---------------------
 <div style="background-color: #63c9d1; border-radius: 8px; border: 20px double; width: auto;">
=============================================
Pour voir le resultat cliquez sur Vue Nouveau Message.
 ET  vous pouvez changer la couleur ecriture et ajouter du contenu en etant sur votre message texte ne fiez pas a l'encadrement qui montre le vrai resultat est celui qui donne sur votre blog. ALlez voir l'apercu qui ce trouve sur votre droite 


===================TRAITS========================
Solid= Une Ligne
Double= Double ligne
Dashed= Trait
Dotted+ Pointillé
Inset=  Bordure Creuse
Outset= Surlever style bomber biseau
Ridge= style bouton

Pour voir des exemples des traits bordures  https://www.tutorialrepublic.com/css-tutorial/css-border.php

---------------------FOND ARRIERE PLAN 2 FONDS avec bordures -----------------
C'est un peu compliquer faut changer une partie du code  mais pour pas vous decouragez je vous suggere faire en fond couleur. Sinon,  voici le code:

<div style="background-color: #63c9d1; background-image: url('URL IMAGE FOND 1'); border-radius: 30px 30px 30px 3Opx; border: 20px double; height: 100%; padding: 30px;">
<div style="background-image: url('URL IMAGE FOND 2'); border-radius: border-radius: 20px 20px 20px 2Opx; border: 10px double; height: 100%; padding: -20px;">
<p style="text-align: center;">&amp;nbsp ;&lt; /p&gt;
</p><p be3="" color:="#000000" style="text-align: center;"><span>ECRIRE TEXTE</span></p>
<p style="text-align: center;">&amp;nbsp ;&lt; /p&gt;
</p><p></p></div></div>

======== FOND ARRIERE PLAN 1 FOND et 1 bordure ==================
<div style="background-image: url('URL FOND IMAGE'); border-radius: border-radius: 22px 22px 22px 22px; border: 10px double; height: 100%; padding: -20px;">
<p style="text-align: center;">&amp;nbsp ;&lt; /p&gt;
</p><p be3="" color:="#000000" style="text-align: center;"><span>ECRIRE TEXTE</span></p>
<p style="text-align: center;">&amp;nbsp ;&lt; /p&gt;
</p><p></p></div></div>

===========FOND COULEUR+ FOND IMAGE ET BORDURES =================

<div style="background-color: #a1e4b4; border-radius: 30px 30px 30px 3Opx; border: 20px double; height: 100%; padding: 30px;">
<div style="background-image: url('URL IMAGE FOND'); border-radius: border-radius: 20px 20px 20px 2Opx; border: 10px double; height: 100%; padding: -20px;">
<p style="text-align: center;">&amp;nbsp ;&lt; /p&gt;
</p><p be3="" color:="#000000" style="text-align: center;"><span>ECRIRE TEXTE</span></p>
<p style="text-align: center;">&amp;nbsp ;&lt; /p&gt;
</p><p></p></div></div>

===============OUTILS =============
=====AUTRES==CSS ===========
Sa peut vous servir de modele de base 

MAINTENANT A VOUS FAIRE LE RESTE  ET LE  PERSONALISER.