ajouter une image dans l'editeur ( code ccs à modifier )

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu ajouter une image dans l'editeur ( code ccs à modifier )

Message par ptitegirafe54 le Dim 24 Mai 2015 - 21:26

Code:
.sceditor-container textarea{
            color: #121010!important;
        }

bonjour , je souhaiterais modifier ce code de ma feuille de style css pour y ajouter une image de fond ?
comment positionner le backround et quel lien de l'hebergeur d'image est a utiliser svp ?

ptitegirafe54
***

Masculin
Messages : 163
Inscrit(e) le : 11/09/2014

http://www.majorette-rail-route.com
ptitegirafe54 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par MlleAlys le Dim 24 Mai 2015 - 23:07

Bonjour,
L'astuce suivant est celui correspondant à votre demande :
Astuce Ajouter une image dans le cadre de réponse
Le lien de l'image à utiliser dans les codes html et css sont l'url de l'image, encore appelé parfois lien direct de l'image.
La position du fond est souvent centrée, ce qui donnerait le code css :
Code:
.sceditor-container iframe, .sceditor-container textarea {
  background:url(URL DE L'IMAGE) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}
Mais après ça dépend de l'image que vous mettez et de ce que vous souhaitez.

MlleAlys
+ Hyperactif +

Messages : 4404
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par ptitegirafe54 le Lun 25 Mai 2015 - 10:17

Merci pour votre réponse , doit je modifier mon code existant ( color ) en ajoutant celui que vous m'avez fourni ou dois je en créer un nouveau ? Le centrage voulu est celui que vous proposez donc nickel !
Merci de m'éclairer Smile

ptitegirafe54
***

Masculin
Messages : 163
Inscrit(e) le : 11/09/2014

http://www.majorette-rail-route.com
ptitegirafe54 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par MlleAlys le Lun 25 Mai 2015 - 10:23

Votre code css actuel applique la couleur à l'élément .sceditor-container textarea
Le code css donné dans le tutoriel applique la couleur à deux éléments : .sceditor-container iframe et .sceditor-container textarea
Vous pouvez donc soit ajouter le nouveau code en plus, soit compléter votre premier code pour qu'il s'applique aux deux éléments voulus en plus d'ajouter le background, ce qui donnerait :
Code:
.sceditor-container iframe, .sceditor-container textarea {
  background:url(URL DE L'IMAGE) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  color: #121010!important;
}

MlleAlys
+ Hyperactif +

Messages : 4404
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par ptitegirafe54 le Lun 25 Mai 2015 - 10:48

Merci pour vitre réponse rapide , et vos bonnes explications tout est découverte encore pour moi . je vous tiens au courant dans la journée . merci

ptitegirafe54
***

Masculin
Messages : 163
Inscrit(e) le : 11/09/2014

http://www.majorette-rail-route.com
ptitegirafe54 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par ptitegirafe54 le Lun 25 Mai 2015 - 15:37

Code:
.sceditor-container iframe, .sceditor-container textarea {
          background:url( [url=http://www.servimg.com/view/13899082/2272][img]http://i19.servimg.com/u/f19/13/89/90/82/scrape15.png[/img][/url] ) !important;
          background-repeat: no-repeat !important;
          background-position: center center !important;
          color: #121010!important;
        }

alors voici le code finalisé , et rien ne se passe


ci dessus voici le lien de l'image à insérer ...

ptitegirafe54
***

Masculin
Messages : 163
Inscrit(e) le : 11/09/2014

http://www.majorette-rail-route.com
ptitegirafe54 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par MlleAlys le Lun 25 Mai 2015 - 15:42

Code:
[url=http://www.servimg.com/view/13899082/2272][img]http://i19.servimg.com/u/f19/13/89/90/82/scrape15.png[/img][/url]
est un code en bbcode pour afficher une image avec un lien dessus dans un message. Ce qu'on veut ici c'est juste l'adresse de l'image, c'est à dire juste https://i19.servimg.com/u/f19/13/89/90/82/scrape15.png (qui est bien une adresse, et quand on clique dessus on tombe sur l'image et QUE l'image, pas de trace de l'hébergeur ou autre)
Le code donne donc :
Code:
.sceditor-container iframe, .sceditor-container textarea {
  background: url(http://i19.servimg.com/u/f19/13/89/90/82/scrape15.png) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  color: #121010!important;
}

MlleAlys
+ Hyperactif +

Messages : 4404
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par ptitegirafe54 le Lun 25 Mai 2015 - 15:55

j'etais entrain de trouver le bon lien en même temps je vous remercie beaucoup d'avoir pris le temps , celà fonctionne , bien à vous ; romeo .

ptitegirafe54
***

Masculin
Messages : 163
Inscrit(e) le : 11/09/2014

http://www.majorette-rail-route.com
ptitegirafe54 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: ajouter une image dans l'editeur ( code ccs à modifier )

Message par MlleAlys le Lun 25 Mai 2015 - 16:01

de rien ^^

..Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton

A bientôt sur ForumActif Smile

MlleAlys
+ Hyperactif +

Messages : 4404
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum