Texte centré


Méthode du HEAD et de la colonne :

Créer une colonne puis ajouter le code ci dessous en modifiant le numéro de la DIV

/******************** Image de fond fixe parallax avec ou sans texte *********************/

/***********Version ecran d'ordinateur ***************/

@media (min-width: 400px) { #cc-m-14049435630 { display: block!important; width: 96vw; left: calc(-50vw + 50%); position: relative; padding:40px !important; background-image: url(https://www.meduana.fr/app/download/10376097498/013-1-2.jpg?t=1453824948); background-size: cover; background-attachment: fixed; background-position: center;  height:650px; }}

/***********Version ecran de smartphone***************/

@media (max-width: 400px) { #cc-m-14049435630 { display: block!important; width: 100%; left: calc(-50vw + 50%); position: relative; padding:10px !important; background-image: url(https://www.meduana.fr/app/download/10376097498/013-1-2.jpg?t=1453824948); background-size: cover; background-attachment: fixed; background-position: center;  height:auto; } }

 

Variante avec le With à 100vw et Backgound contain pour le smartphone

Voir exemple site : netsoleco.jimdofree.com


/******************** Image de fond fixe parallax avec ou sans texte *********************/
@media (min-width: 768px) { #cc-m-XXXXXX{ display: block!important; width: 80vw; left: calc(-50vw + 50%); position: relative; padding:10vw !important; background-image: linear-gradient(180deg,rgba(209, 162, 89, 0.8901960784313725) 0%,rgba(222, 174, 93, 0.28) 100%),url(https://image.jimcdn.com/app/cms/image/transf/none/path/se9f98d08e2c6ed47/image/ie2a6e7426427ef0e/version/1593962838/image.jpg) ;  background-blend-mode: unset; background-size: cover; background-attachment: fixed; background-position: center;  height:auto; }}
@media (max-width: 768px) { #cc-m-XXXXXX{ background-image: linear-gradient(180deg,rgba(209, 162, 89, 0.8901960784313725) 0%,rgba(222, 174, 93, 0.28) 100%),url('https://image.jimcdn.com/app/cms/image/transf/none/path/se9f98d08e2c6ed47/image/ie2a6e7426427ef0e/version/1593962838/image.jpg'); width: 100%; left: calc(-50vw + 50%); position: relative; padding:18px !important; background-size: cover; background-position: center; height:auto;} }



Pour mettre un texte avec un fond de couleur il faut aller dans le CODE HTML et y mettre ceci :

<p style="text-align: center; background-color: powderblue; padding: 20px; margin-left: 25%; margin-right: 25%; border-radius: 10px;">Texte centr&eacute;</p>

Méthode SANS HEAD et donc une seule image en fond :

Mettre le code ci dessous dans un élément HTML WIDGET


<div style="display: block!important;margin-left: -1000px;margin-right: -1000px;">

  <div>

    <div style=

      "background-image: url(https://www.meduana.fr/app/download/10376097498/013-1-2.jpg?t=1453824948); background-size: cover; background-attachment: fixed; background-position: center; width: 100%!important; max-width: 100%; margin: 25px 0;height:650px;">

    </div>

  </div>

</div>