Edul@b Lot Est

Un peu de code dans vos blogs

Par admin vicat, publié le mercredi 20 février 2019 11:12 - Mis à jour le mercredi 20 février 2019 11:12

Comment agrémenter vos articles dans l'ENT avec un peu de code (il suffit de savoir copier-coller)

Nous allons voir comment agir sur la mise en forme du texte en ajoutant du code en mode source (la dernière icône de la barre d'icônes)

Notez que des styles prédéfinis sont donnés dans le menu format. de manière générale, on évitera de souligner, surligner de couleurs flashy...). On peut toutefois avoir besoin d'un peu plus que ce que la barre d'outils propose.

Il vous suffira, après avoir saisi votre texte normalement, de cliquer sur l'icône source et de rajouter les codes donnés de part et d'autre de votre texte.

Pour mettre du texte en rouge : <span style="color:#ff0000">Texte</span>. 

Voici un exemple.

Ce site vous donnera les codes couleurs

Pour barrer du texte : <span style="text-decoration:line-through">Texte</span>

Voici un exemple.

Créer une info-bulle au survol du texte : <span style="border-bottom: 2px dotted #FF8000;cursor:help" title="texte à afficher dans une info-bulle">texte</span>

Il peut être utile de faire apparaître une  info-bulle au survol de la souris pour créer une annotation.

Créer un menu déroulant. Ce petit bout de code vous permettra de créer un menu déroulant qui pourra fournir une aide lexicale par exemple.

<select name="select"><option selected="selected">Help!</option><option value="1">to break up = se séparer</option><option value="2">to eat-ate-eaten = manger</option><option value="3">dirty = sale</option></select>

Voici ce que ça  donne : Essayez d'écrire et de traduire cette phrase. L'aide est fournie dans le menu déroulant sous l'audio.

 

 

Vous voulez ajoutez des items ? Il vous suffit de rajouter <option value="3">votre texte</option></select>,  <option value="4">votre texte</option></select>, <option value="5">votre texte</option></select>