Quelques commandes utilisables sur ce forum

En vrac, et petit à petit.

Je commence donc par des ombres d'images.

Code:

<img src="http://r17.imgfast.net/users/1714/62/02/30/avatars/4633-90.jpg" alt="exemple css box-shadow" style="height:100px; box-shadow:-10px -10px silver; margin:10px;" />

Code:

<img src="http://r17.imgfast.net/users/1714/62/02/30/avatars/4633-90.jpg" alt="exemple css box-shadow" style="height:100px; box-shadow:10px -10px silver; margin:10px;" />

Code:

<img src="http://r17.imgfast.net/users/1714/62/02/30/avatars/4633-90.jpg" alt="exemple css box-shadow" style="height:100px; box-shadow:10px 10px silver; margin:10px;" />

Code:

<img src="http://r17.imgfast.net/users/1714/62/02/30/avatars/4633-90.jpg" alt="exemple css box-shadow" style="height:100px; box-shadow:-10px 10px silver; margin:10px;" />

Code:

<img src="http://r17.imgfast.net/users/1714/62/02/30/avatars/4633-90.jpg" alt="exemple css box-shadow" style="height:150px; box-shadow:0px 0px 15px 10px silver; margin:15px;" />

Contact :

Code:

<address title="JPhMM">
<a href="mailto:pasvraimentmonadressemail@labonneblague.com">Mon adresse mail</a>
</address>

Mon adresse mail

Écriture de droite à gauche (utilisée pour certaines langues)

Code:

<bdo dir="ltr">Texte lisible de gauche à droite (left to right : ltr)</bdo>
<bdo dir="rtl">Texte lisible de droite à gauche (right to left : rtl)</bdo>

Texte lisible de gauche à droite (left to right : ltr)
Texte lisible de droite à gauche (right to left : rtl)

Espacement des mots :

Code:

<span style="word-spacing:10px;">Vous pouvez espacer vos mots. Exemple : word-spacing:10px</span>
<span style="word-spacing:20px;">Vous pouvez espacer vos mots. Exemple : word-spacing:20px</span>
<span style="word-spacing:30px;">Vous pouvez espacer vos mots. Exemple : word-spacing:30px</span>
<span style="word-spacing:50px;">Vous pouvez espacer vos mots. Exemple : word-spacing:50px</span>

Vous pouvez espacer vos mots. Exemple : word-spacing:10px
Vous pouvez espacer vos mots. Exemple : word-spacing:20px
Vous pouvez espacer vos mots. Exemple : word-spacing:30px
Vous pouvez espacer vos mots. Exemple : word-spacing:50px

Euh, y'a des trucs qui ne servent à rien là ! :gratte: :lol:

Espacement des lettres.

Code:

<label style="letter-spacing:2px;">On peut aussi espacer les lettres, bien sûr. Ici 2 pixels.</label>
<label style="letter-spacing:4px;">On peut aussi espacer les lettres, bien sûr. Ici 4 pixels.</label>
<label style="letter-spacing:10px;">On peut aussi espacer les lettres, bien sûr. Ici 10 pixels.</label>

On peut aussi espacer les lettres, bien sûr. Ici 2 pixels.
On peut aussi espacer les lettres, bien sûr. Ici 4 pixels.
On peut aussi espacer les lettres, bien sûr. Ici 10 pixels.

Code:

<div style="width:450px; height:120px; border:dotted 1px black; overflow:auto;">[quote="olive-in-oil"]Euh, y'a des trucs qui ne servent à rien là ! :gratte:  :lol: [/quote]Fais gaffe à ce que tu dis !
Sinon je te coince dans une scrollbar.

 :lol:

 :lol:

 :diable:
</div>

Et ne me dis pas que tu n'as jamais eu envie d'ombrer ton texte avec du vert, olive :lol:

Code:

<label style="font-size:18px; text-shadow: green 5px 5px 2px;">Et ne me dis pas que tu n'as jamais eu envie d'ombrer ton texte avec du vert, olive  :lol:  </label>

Alors, elles sont comment ces commandes ?

pas bien

bien

mais qu'est-ce que cela peut bien me faire ?

Code:

Alors, elles sont comment ces commandes ?

<input type="checkbox" id="chkbox1" value="pas bien" /> <label for="chkbox1">pas bien</label>

<input type="checkbox" id="chkbox2" value="bien" /> <label for="chkbox2">bien</label>

<input type="checkbox" id="chkbox3" value="mais qu'est-ce que cela peut bien me faire ?" /> <label for="chkbox3">mais qu'est-ce que cela peut bien me faire ?</label>

JPhMM a écrit:

olive-in-oil a écrit:Euh, y'a des trucs qui ne servent à rien là ! :gratte: :lol:

Fais gaffe à ce que tu dis !
Sinon je te coince dans une scrollbar.

:lol:

:lol:

:diable:

:Lool:

Si tu as un truc pour un spoiler qui fonctionne en HTML en dehors du forum je suis preneur/mendiant.

xphrog a écrit:Si tu as un truc pour un spoiler qui fonctionne en HTML en dehors du forum je suis preneur/mendiant.

Je vais essayer de te répondre ce soir.

JPhMM a écrit:Contact :

Code:

<address title="JPhMM">
<a href="mailto:pasvraimentmonadressemail@labonneblague.com">Mon adresse mail</a>
</address>

Mon adresse mail

Attention avec ça, l’adresse e-mail est visible par les robots spammeurs.

Je me souviens d'avoir trouvé cela http://gendou.com/t/26412, mais l'idée que tout y est enrobé dans du javascript (si GetElementbyID est javascript) me fait un peu peur. Il faut que je devienne plus téméraire.

---

Plus léger: expliquer un sigle aux non-initiés --> radar

code:

Fact: Tout comme le HTML peut être lu et interprété par le forum, il peut également être lu est interprété par les wikis: même si la syntaxe wiki est très peu envahissante (notamment pour les tables {-, les listes *, etc.), ce n'est pas une mauvaise idée d'y écrire en HTML si l'on risque de vouloir ensuite adapter la présentation rapidement. (Je m'en rend compte un peu tard ).

Sur certaines pages de Wikipedia il y a des éléments qu’on peut afficher ou cacher en cliquant et il me semble que tout est en HTML+CSS. Par exemple en bas de la page http://fr.wikipedia.org/wiki/France.

merci, c'est beau en effet. Il faudrait trouver et étudier le CSS sous-jacent pour comprendre la traduction de {{palette (qui semble en plus récupérer les résumés d'autres pages; donc, il y a sans doute de la programmation à l'intérieur de la boîte noire :abk: )

Le lien était http://fr.wikipedia.org/wiki/France (il y avait un point à la fin dans mon message précédent, je n’avais pas vu, je vais l’éditer).

Wikipedia semble utiliser JavaScript, après vérification.
En cherchant « spoiler pure CSS » sur internet on trouve des idées en CSS pur, mais je n’ai pas testé.

Désolé, xphrog, je n'ai rien trouvé de satisfaisant.

Quelques cadres.

Code:

<div style="border:solid 2px black; width:450px; padding:10px; outline:solid 3px steelblue;outline-offset:-4px;">Le poème dit :
[i]Est-il un coeur parfumé pour renoncer de lui-même aux jours de printemps !
Dans la chaumière, les doigts effilés brodent une gaze bleutée —
Arrivée aux canards mandarins, l'aiguille soudain se brise :
Dans la peinture, près de la volupté se cache un esprit malin ![/i]
</div>

Code:

<div style="border:solid 2px black; width:450px; padding:10px; outline-style:double;outline-width:5px; outline-color:steelblue;"Le poème dit :
[i]Est-il un coeur parfumé pour renoncer de lui-même aux jours de printemps !
Dans la chaumière, les doigts effilés brodent une gaze bleutée —
Arrivée aux canards mandarins, l'aiguille soudain se brise :
Dans la peinture, près de la volupté se cache un esprit malin ![/i]
</div>

Code:

<div style="border:solid 2px black; width:450px; padding:10px; outline-style:dotted;outline-width:3px; outline-color:green;">Le poème dit :
[i]Est-il un coeur parfumé pour renoncer de lui-même aux jours de printemps !
Dans la chaumière, les doigts effilés brodent une gaze bleutée —
Arrivée aux canards mandarins, l'aiguille soudain se brise :
Dans la peinture, près de la volupté se cache un esprit malin ![/i]
</div>

Merci en tout cas JP, FD m'a trouvé plusieurs solutions: http://jsfiddle.net/tovic/bY6ty/

Et en ajoutant "onmouseover" on trouve des jolies: http://sjfr.de/codesnipp.it/spoiler.html

Merci

De rien.

Et enfin, je finirai ce soir avec un petit cadeau pour tous ceux
 que en ont
  marre
   de ne pouvoir
    faire
     d'espaces
      dans leurs messages sur le forum.
       En effet,
      une simple petite commande
     vous en donne
    la possibilité.
   Bref,
  le bonheur est dans
 le « pre ».
Enjoy    

Code:

<pre>Et enfin, je finirai ce soir avec un petit cadeau pour tous ceux
 que en ont
  marre
  de ne pouvoir
    faire
    d'espaces
      dans leurs messages sur le forum.
      En effet,
      une simple petite commande
    vous en donne
    la possibilité.
  Bref,
  le bonheur est dans
 le « pre ».
Enjoy  :D
</pre>