astuce donnée par Papasti :

Ajouter le onmouseover dans le code html.

Exemple (partie en couleur à ajouter):

<img onmouseover="javascript:Help.bubble(this,'&lt;h2&gt;Exemple&lt;/h2&gt;');" src="http://data0.ek.la/monpremierblog/mod_article45847799_4f86e5251e99b.jpg?9261" alt="jgjgj" />

Ici le texte affiché est celui en bleu et il va s'afficher au format des titres de type h2 

l'avantage de cette méthode est de pouvoir mettre du gras, de l'italique, des images etc.

On peut aussi jouer sur l'apparence de la bulle d'aide avec un css comme celui-ci:

#help_bubble 
{
   color:white;
   border-radius:10px;
   background-color:black;
   opacity:0.8;
}

astuce donnée par Cotonelle :

ajouter dans CSS :

.module_menu_contenu ul {list-style-position: inside; list-style-type: disc;}

et pour obtenir la même chose uniquement dans le module "derniers articles"

.module_menu_type_lastarticles ul {list-style-position: inside; list-style-type: disc;} 

donnée par Papasti :

#menubar {font-family:Comic Sans MS ,Helvetica,"Bitstream Vera Sans",sans-serif;

astuce donnée par Samiie :

p {text-decoration : none ! important; text-shadow : red 5px 5px 9px;}

astuce donnée par Anne :

.module_contenu{
    -webkit-border-radius: 10px;     -moz-border-radius: 10px;     border-radius: 10px;}

pour le menu de gauche s'il y en a deux :

#menu1{
    -webkit-border-radius: 10px;     -moz-border-radius: 10px;     border-radius: 10px;}
 

et pour les titres des modules du menu de gauche s'il y  en a 2 :

#menu1 .module_menu_titre{
    -webkit-border-radius: 10px;     -moz-border-radius: 10px;     border-radius: 10px;} 

(on peut bien entendu changer la valeur de l'arrondi).

Pour la bordure du contenu des articles, on emploie :

.module_contenu{
    -webkit-border-radius: 10px;
-moz-border-radius: 10px;
   border-radius: 10px;}

astuce donnée par luette :

#form_cavom_image {display:none;}

.commentbody p img{display:none;}
.commentbody p img[src*="emoticons"]{display:block;}

La première ligne du code enlève le bouton pour insérer une image (mais conserve les emoticones)

La seconde cache les images des commentaires (y compris les emoticones)

La troisième rétablit l'affichage des emoticones uniquement.

Les images ne sont pas supprimées. Il suffit d'enlever le code css pour qu'elles apparaissent à nouveau.

astuce donnée par Mike :

<img style="box-shadow: 10px 7px 3px grey;" src="http://data0.eklablog.com/papyrocktest/perso/img%20video%2001.jpg" alt="" width="200" />

La première valeur indique le décalage horizontal vers la droite (ici 10px)
le deuxième correspond au décalage vertical vers le bas (ici 7px) 
le chiffre suivant indique la force du dégradé (ici 3px) 
et enfin, la couleur (ici grey)

Pour appliquer une ombre sur toutes les images du blog, ajouter ce code dans la session CSS:

img { box-shadow: Dodgerblue 3px 0px 10px;}

et pour que ce code ne s'applique pas à toutes les images :

Remplacer dans ajout CSS:

img { box-shadow: black 6px 6px 10px;}

par

p img { box-shadow: black 6px 6px 10px;}

astuce donnée par Anne :

Ajouter dans le CSS :

 .module_titre_contenu {
    padding: 5px 15px;
    height: auto;}

Ce code  consiste à adapter la hauteur du module du titre en fonction de la longueur du titre justement (sur une ou deux lignes) .

Pour le titre du menu :

#menu1 .module_menu_titre{
    padding: 5px 15px;
    height: auto;}

astuce donnée par stormalo :

(ce qui est en vert est un ajout facultatif, pour info)

/* image opaque */
img {
-moz-transition: opacity 0.4s linear 0s;
-webkit-transition: opacity 0.4s linear 0s;
transition: opacity 0.4s linear 0s;
opacity: 0.5;
}
/* image claire */
img:hover {
-moz-transition: opacity 0.4s linear 0s;
-webkit-transition: opacity 0.4s linear 0s;
transition: opacity 0.4s linear 0s;
opacity: 1;
}

astuce donnée par rezemika :

<div style="margin: 5px 10px 10px;">
<div class="smallfont" style="margin-bottom: 2px;"><strong>NOM</strong> <input style="margin: 0px; padding: 0px; width: 45px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Cacher'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Montrer'; }" type="button" value="Montrer" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 2px;">
<div style="display: none;"><br />
<p>VOTRE TEXTE</p>
</div>
</div>
</div>

astuce donnée par macema :

.article_text img {

 -moz-border-radius : 25px;

 -webkit-border-radius : 25px;

 -khtml-border-radius : 25px;

 border-radius : 25px; }

pour arrondir une image précise (astuce donnée par pépins et citron) :

ajouter entre img et src

style="border-radius: 25px;"

astuce donnée par Papasti :

On peut appliquer sur les images une opacité (par exemple 60%) ce qui donne en CSS:

opacity:0.6;

Et on peut leur appliquer une opacité de 100 % au survol.

Exemple pour les images du module derniers visiteurs:

.module_menu_type_lastvisitors img{
  opacity:0.6;
}
.module_menu_type_lastvisitors img:hover{
  opacity:1;
}

Pour toutes les images:

 img{
  opacity:0.6;
}
 img:hover{
  opacity:1;
}

astuce donnée par Stormalo :

Pour une image placée à gauche du texte avec un écart de 15 pixels:
mettre style="float: left; margin: 15px" entre img ou src

Exemple: pour afficher l'image de photo1 a gauche du texte avec 15 pixels de marge
<p><img style="float: left; margin: 15px;" src="URL Photo1" alt="" /></a></p>