Tutoriels tutoriels tutoriels tutoriels tutoriels tutoriels

Code:

body.chatbox {
background-image: url('URLIMAGE');
}

Code:

<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
 <tr>
 <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
 </tr>
 </table>

Code:

<!-- END switch_login_popup -->

Code:

<th nowrap="nowrap" width="50">{L_TOPICS}</th>
<th nowrap="nowrap" width="50">{L_POSTS}</th>

Code:

<td class="row3" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td>

Code:

{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
        </span>

Code:

<table width="100%"><tr><td align="right"><span class="gensmall"><b>SUJETS</b> :  {catrow.forumrow.TOPICS} | <b>MESSAGES</b> : {catrow.forumrow.POSTS}</span></td></tr></table>

Code:

<th nowrap="nowrap" width="50">{L_TOPICS}</th>
<th nowrap="nowrap" width="50">{L_POSTS}</th>

Code:

<td class="row3" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.TOPICS}</span>
</td>
<td class="row2" align="center" valign="middle" height="50">
<span class="gensmall">{catrow.forumrow.POSTS}</span>
</td>

Code:

<a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>


Code:

<table width="100%"><tr><td><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></td><td align="right"><span class="gensmall"><b>SUJETS :</b> {catrow.forumrow.TOPICS} | <b>MESSAGES :</b> {catrow.forumrow.POSTS}</span></td></tr></table>

• De gauche à droite :
  
  
  TON TEXTE ICI
  
  

  Code:

  <MARQUEE behavior="scroll" align="center" direction="right" height="120" scrollamount="2" scrolldelay="1" onmouseover='this.stop()' onmouseout='this.start()'>
TON TEXTE ICI</MARQUEE>

  
  
• De droite à gauche :
  
  TON TEXTE ICI
  
  

  Code:

  <marquee>TON TEXTE ICI</marquee>

  
  Ou en BBCode :
  
  TON TEXTE ICI
  
  

  Code:

  [scroll]TON TEXTE ICI[/scroll]

  
  
• De bas en haut :
  
  
  TON TEXTE ICI
  
  

  Code:

  <MARQUEE behavior="scroll" align="center" direction="up" height="120" scrollamount="2" scrolldelay="1" onmouseover='this.stop()' onmouseout='this.start()'>
TON TEXTE ICI</MARQUEE>

  
  Ou en BBCode :
  
  TON TEXTE ICI
  

  Code:

  
[updown]TON TEXTE ICI[/updown]

  
  
• En diagonale :
  
  En BBCode :
  
  TON TEXTE ICI
  
  

  Code:

  [scroll][updown]TON TEXTE ICI[/updown][/scroll]

  
  > Les codes sont en html sauf lorsque c'est préciser en BBCode.
  
  Pour que le défilement s'arrête quand le curseur passe sur une image :
  

  Code:

  <marquee onmouseout="this.start();" onmouseover="this.stop();" loop="infinite" scrolldelay="4" scrollamount="4" direction="TA DIRECTION DE DEFILEMENT" behavior="SCROLL"> TES IMAGES </marquee>

  
  

Code:

 <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span>

            <span class="postdetails poster-profile">
            {postrow.displayed.POSTER_RANK}

            {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}


            <!-- BEGIN profile_field -->
            {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field -->

Code:

<center><span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span>

            <span class="postdetails poster-profile">
            {postrow.displayed.POSTER_RANK}

            {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}


            <!-- BEGIN profile_field -->
            {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
            <!-- END profile_field --></center>

Code:

  .rotate {

/* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

Code:

{catrow.forumrow.FORUM_DESC}

Code:

<div class="descriptionsforum">{catrow.forumrow.FORUM_DESC}</div>

Code:

.descriptionsforum {
PROPRIÉTÉS;
}

Spoiler:

Code:

{postrow.displayed.SIGNATURE}"

Code:

<div class="limitation-signature">{postrow.displayed.SIGNATURE}</div>

Code:

.limitation-signature img {
max-width: 600px;
max-height: 150px;

_width: expression((this.offsetWidth>=this.offsetHeight) ? Math.min(parseInt(this.offsetWidth), 600 ) : true);
_height: expression((this.offsetHeight>this.offsetWidth) ? Math.min(parseInt(this.offsetHeight), 150 ) : true);
}

Code:

<!-- BEGIN switch_legend -->

Code:

<!-- END switch_legend -->

Code:

<!-- BEGIN switch_legend --> Votre contenu <!-- END switch_legend -->

Code:

<img src="URL DE VOTRE IMAGE" border="0" alt="" />

Code:

<span class="votre_titre">VOTRE CONTENU</span>

Code:

.votre_titre {
 Vos personnalisations
 }

Et bien, le langage et la structure évoluent ainsi que les balises par défaut, j'expliquerai ceci dans la seconde partie. La chose essentielle qu'il faut savoir c'est que le HTML5 est une version qui va ou risque de révolutionner le web pour une bonne raison: il offre de nouvelles possibilités, une structure plus simple et plus large. Associée avec le CSS3 et ses transitions, ainsi qu'au javascript et jquery, le HTML5 va réellement concurrencer le Flash et détrônerAdobe de sa suprématie sur les navigateurs. Cela ne veut peut-être rien dire pour certains mais globalement, le HTML5 est un langage plus facile à utiliser et qui offre plus d'options.

En HTML5 le doctype s'annonce comme ceci, en début de code:

Code:

<!DOCTYPE html>

c'est une balise ouvrante, qui indique donc que vous utilisez du HTML. Cependant vous remarquerez qu'elle n'indique aucun chiffre. Comme écrit ci-dessus le HTML5 est un langage qui se simplifie et enlève donc toutes informations superflues. Cette balise cependant ne se ferme pas.

Code:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Document sans nom</title>
</head>

<body>
</body>
</html>

Voilà comment est composé de base une page HTML5. Maintenant explication des différentes balises.
▷ < html > sert à ouvrir le document, il ne sert pas à indiquer là quelle version du langage vous utilisez comme c'est la fonction du doctype. La balise sert à délimiter la zone de code de la page.

▷ < head > cette partie de la page ne sera pas afficher dans la page. Cela peut paraître un peu absurde mais si si. Tout ce qui est inscrit dans cette partie sert à faire des liens vers d'autres documents comme du CSS ou du Javascript par exemple. Le navigateur va d'abord ouvrir tout ce qui se trouve dans cette balise avant d'afficher le contenu.

▷ < meta charset="utf-8" > sert à définir quel type de symbole vous allez utiliser dans votre page. C'est un peu compliqué à expliquer, mais globalement un caractère sur un clavier ne correspond pas à une lettre, il arrive souvent que lorsque vous faites une page à la place d'avoir un " é " ou un " à ", on vous affiche des symboles un peu bizarroïdes, ces symboles en fait sont le caractère, c'est comme ça que l'ordinateur arrive à afficher les lettres de l'alphabet. En gros, si vous voulez que votre texte soit parfait, c'est une obligation de le mettre il ne faut pas discuter.

▷ < title > sert à nommer votre fichier dans l'onglet. Ce qui se trouve entre ces balises-ci sera le nom affiché dans votre onglet sur votre navigateur.

▷ < body >, la balise la plus attendue je suppose. C'est entre ces balises-ci qu'il vous faudra écrire vos codes html et uniquement là. Le body est le contenu de votre page, c'est ce qui sera affiché.

▷ La première option utilisée par les codeurs professionnels en terme général, le CSS est dans un fichier externe et il est lié à la page HTML via un lien après la balise title:

Code:

<link href="URL DU FICHIER CSS" rel="stylesheet" type="text/css">

▷ La seconde option la plus commune et la plus facile pour tout le monde est d'intégrer le css directement dans la page HTML, toujours après la balise title dans les balise head:

Code:

<style>

/*VOTRE CSS*/

</style>


Vous l'aurez remarqué il est là inutile de préciser quel langage vous utilisez, si c'est du javascript, du css ou autres car nous sommes en HTML5.

Oubliez toutes vos balises center et autres que vous inventez pour vous faciliter la vie! Dans le langage HTML il existe des balises qui comme je l'ai expliqué évoluent en fonction des versions, certains ne sont plus d'actualités, elles fonctionnent encore mais sont considérées cependant comme des erreurs.

▷ < center > n'existe plus! Il est inutile de l'utiliser bien qu'elle fonctionne encore, cette balise est erronée. A présent il faut utiliser le code ci-dessous. Certes c'est un peu plus long et moins beau, mais ce n'est pas une raison pour l'ignorer!

Code:

<div align="center">....</div>

▷ < i > en HTML5 n'existe plus non plus. Cette balise est remplacée par un autre code. Cependant comme dit là, il n'est valable qu'en HTML5.

Code:

<em>...</em>

▷ Les balises inventées sont prohibées! Ce que j'appelle balises inventées ce sont des balises comme celles-ci

Code:

<text1> trucmuche</text1>

. < text1 > n'est pas une balise par défaut dans le HTML et donc, même si elle va fonctionne car vous l'aurez stylisée dans le CSS, le navigateur va mettre un certains temps avant de liés la balise au CSS. Après, rien ne vous empêche de styliser les balises par défauts avec une ID. Qu'est-ce qu'une id? Je le définirai plus tard.

Pour plus de faciliter et savoir ce qui existe déjà voici un petit lien référentiel des balises par défaut existantes: Balises

Le titre peut paraître un peu absurde, mais pourtant mine de rien beaucoup font des erreurs de ce côté là. Le plus communément on code en utilisant une div ouvrante où l'on insère son code, puis une div fermante, mais d'autres balises ne se ferment pas comme ceci. Les balises aussi ne s'ouvrent et ne se ferment pas n'importe comment.

▷ < br > est une balise pour effectuer un retour à la ligne. L'écrire comme je l'ai fait ci-contre est en réalité une faute, une faute que la grande majorité des gens font. br est une balise qui se ferme, mais d'une manière un peu spéciale, elle se ferme à l'aide d'un slash.

Code:

<br> est une faute. Il faut écrire <br/>

▷ < img src="..." > fonctionne comme br. Cela ne change cependant pas l'efficacité de la balise, elle fonctionne quand même, mais pour éviter tous problèmes mieux vaut respecter les règles et fermer toutes les balises. Cependant ce n'est pas la seule faute que vous faites avec cette balise. Ceci n'est pas une obligation, mais si vous faites valider votre page HTML dans un vérificateur, ce que vous ne mettrez pas sera compter comme une faute.

En effet, quand vous utilisez la balise img, il faut évidemment donner le lien de l'image mais aussi lui ajouter une propriété qui se nomme alt. Cette propriété est en théorie obligatoire et permet de fournir une description sur l'image. L'utilité? Si l'image ne s'affiche pas, en théorie c'est ce qu'il y aura d'écrit dans l'attribut alt qui s'affichera. Cela peut donc renseigner sur la nature de l'image.

Code:

<img src="url de l'image" alt="description"/>

▷ L'ordre de fermeture des balises. Oui il existe un ordre pour fermer ses balises. Vous ne pouvez pas les fermez n'importe où et quand bon vous semble, c'est le meilleur moyen de créer des bugs dans votre rendu croyez-moi. Ainsi, la première balise ouvert doit être la dernière fermée.

Code:

Exemple:

<div class="truc">
  <span class="muche">
    <img src="lien" alt="blabla"/>
  </span>
 
 Lorem ipsum.
</div>


N'hésitez pas non plus à décaler vos balises pour mieux vous y repérer avec une sorte d’échelon pour savoir quel balise vous avez ouvert et quand vous l'avez refermée. Cependant, cela n'est valable que dans une page HTML et non dans un post simple comme celui-ci de FA.

ATTENTION: autre erreur d'ouverture et de fermeture dans les tableaux. Il ne faut jamais entrelacer une div et un td comme ceci:

Code:


<table>
  <tr>

  <div class="fond">
      <td>
        BLABLABLABLABLABLABLABLABLA
        <img src="..." alt="..."/>
  </div>
  <div class="fond2">
        </td>
        <td>
        BLABLABLABLABLABLABLABLABLA
        </td>

</tr>
      </div>
</table>


Ce que je viens de faire là est une grave erreur. Il faut fermer les balises avec cohérence sans entrelacer les td et les div. Le code devient alors:

Code:


<table>
  <tr>


      <td>
  <div class="fond">
        BLABLABLABLABLABLABLABLABLA
        <img src="..." alt="..."/>
  </div>

        </td>
        <td>
  <div class="fond2">
        BLABLABLABLABLABLABLABLABLA
  </div>
        </td>

</tr>
</table>


▷ Si vous avez besoin de faire plusieurs paragraphes, en général vous faites comme ceci:

Code:


<div style="text-align: justify;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed malesuada facilisis suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In quis est urna. Proin vel ultrices lorem. Suspendisse sed interdum justo. Etiam vel interdum eros. Proin tempor cursus nunc, vel mollis urna imperdiet et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Fusce pulvinar, mi non luctus auctor, enim enim luctus dolor, id scelerisque velit nisl sed magna.<br/> Fusce commodo ante in leo congue ut tincidunt sem pulvinar. Curabitur non eros sed leo fringilla porttitor. Donec eget eleifend purus. Suspendisse nec purus at tellus volutpat hendrerit. Sed ullamcorper aliquet lacus, ac porttitor ante viverra sagittis. Ut vitae massa odio, ut tempus elit. Maecenas rutrum, urna in placerat pulvinar, urna diam faucibus eros, non elementum nibh risus nec dui. In hac habitasse platea dictumst. Suspendisse condimentum sem sit amet enim porta a pretium quam viverra. Vestibulum aliquam scelerisque quam, et luctus lacus euismod et. Donec vitae ante ut augue lobortis varius vel in nibh.
</div>

Autant vous dire que c'est pas super lisible. Personnellement je vous conseille de décompacter vos codes et surtout d'utilise une balise par défaut qui se nomme < p >. Cette balise sert à former des paragraphes tout seul. Evidemment tout ce que vous aurez à faire après sera d'indiquer dans le css quelle propriété vous voulez attribuer à la balise p. Cela vous évitera de répéter 56fois la div.

Code:


<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed malesuada facilisis suscipit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In quis est urna. Proin vel ultrices lorem. Suspendisse sed interdum justo. Etiam vel interdum eros. Proin tempor cursus nunc, vel mollis urna imperdiet et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Fusce pulvinar, mi non luctus auctor, enim enim luctus dolor, id scelerisque velit nisl sed magna.
</p>

<p>
Fusce commodo ante in leo congue ut tincidunt sem pulvinar. Curabitur non eros sed leo fringilla porttitor. Donec eget eleifend purus. Suspendisse nec purus at tellus volutpat hendrerit. Sed ullamcorper aliquet lacus, ac porttitor ante viverra sagittis. Ut vitae massa odio, ut tempus elit. Maecenas rutrum, urna in placerat pulvinar, urna diam faucibus eros, non elementum nibh risus nec dui. In hac habitasse platea dictumst. Suspendisse condimentum sem sit amet enim porta a pretium quam viverra. Vestibulum aliquam scelerisque quam, et luctus lacus euismod et. Donec vitae ante ut augue lobortis varius vel in nibh.
</p>

▷ Il existe par défaut, une balise pour des titres. Cette balise se nomme h et est suivi d'un nombre allant de 1 à 6 h1 étant le titre le plus gros et h6 le titre le plus petit, exemple:

Titre h4

Titre h5

Titre h6

▷ Dans le CSS, les class se nomme comme ceci: .nom_de_la_class {....}

▷ Dans le CSS, les ID se nomment comme ceci: #nom_de_lid {....}

D'ailleurs qu'est-ce qu'une ID? Une ID est une propriété que tu ne peux utiliser qu'une seule fois dans ton code à l'invers des class. Par exemple la class "fond" peut se répéter 3, 4, 5 fois ou plus encore, tandis que l'ID qui se nommera "fond" ne pourra s'utiliser qu'une seule fois. A noter que si vous mettez dans votre CSS ceci:

Code:

#fond2 p {
text-align: left;
}


Les propriétés associés à la balise p dans l'ID fond2 ne sera valable quand dans la div id "fond2". Un ID peut être très pratique donc!

▷ Dans le CSS, les balises par défaut se nomment comme ceci: nom_de_la_balise {....} sans aucune ponctuation devant le nom.

▷ N'hésitez pas à espacer vos codes pour vous y retrouver, dans une page HTML, les sauts à la ligne via la touche entrée, ne sont pas compter dans le contenu.

FIN DU TUTORIEL

Code:

<div style="overflow: auto; height: 80px;" class="window" align="justify">TEXTE TEXTE TEXTE</div>

Code:

body {
            background: url('URL') no-repeat top center;
            background-color: #Codecouleur;
}

Background-image ⟶ url('...') (image de fond)
Background-position ⟶ top center (position du fond actuellement placé en centre en haut de page)
Background-repeat ⟶ no-repeat (pas de répétition de l'image)

Code:

<SCRIPT LANGUAGE="JavaScript"> 
<!-- generateur 
 
Texte = new Array(3); 
Texte[0]="TEXTE 0"; 
Texte[1]="TEXTE 1"; 
Texte[2]="TEXTE 2"; 
Texte[3]="TEXTE 3"; 
Texte[4]="TEXTE 4";
 
index = Math.floor(Math.random() * Texte.length); 
document.write(Texte[index]); 
 
//--> 
</SCRIPT>

Code:

Texte[X]="TEXTE X";

Code:

<link href='http://fonts.googleapis.com/css?family=Dynalight' rel='stylesheet' type='text/css'>

Code:

<head>

Code:

<script type="text/javascript">
  WebFontConfig = {
    google: { families: [ 'Dynalight::latin' ] }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
      '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })(); </script>

Code:

<script type="text/javascript"></script>

Code:

<link href='http://fonts.googleapis.com/css?family=Dynalight' rel='stylesheet' type='text/css'>

Code:

font-family: 'Dynalight', cursive;

Code:

.nomdelaclass { font-family: 'Dynalight', cursive; }

Code:

#nomdelaclass { font-family: 'Dynalight', cursive; }

Code:

<span style="font-family: 'Dynalight', cursive;">Texte</span>

Code:

<div style="font-family: 'Dynalight', cursive;">Texte</div>

Code:

.sceditor-container.ltr.sourceMode {
  width:95% !important; /* Ne pas enlever le !important */
}

.sceditor-container.ltr.wysiwygMode {
  width:95% !important; /* Ne pas enlever le !important */
}

Code:

.sceditor-container iframe, .sceditor-container textarea {
  background-color: #code couleur !important; /* Ne pas enlever le !important */
}

Spoiler:

Code:

.sceditor-container.ltr.sourceMode {
  width:95% !important; /* Ne pas enlever le !important */
  background-color: #000 !important;
}

.sceditor-container.ltr.wysiwygMode {
  width:95% !important; /* Ne pas enlever le !important */
  background-color: #000 !important;
}

Code:

.sceditor-emoticons .smiley {
  width: auto !important;
  height: auto !important;
}

Code:

.sceditor-dropdown.sceditor-emoticons {
  max-height: 300px;
  overflow: auto;
}

Liste des codes des boutons:

Code:

.sceditor-button.sceditor-button-time {
  display: none !important;
}

Pour modifier la partie supérieur contenant les outils (image)

Code:

div.sceditor-toolbar
        {
  background-color: #000 !important;
        }

Pour modifier le textarea, là où on écrit (image)

Code:

.sceditor-container iframe, .sceditor-container textarea
        {
  background-color: #000 !important;
        }

Pour modifier un groupe de boutons (image)

Code:

div.sceditor-group
        {
  background-color: #000 !important;
        }

Pour modifier un bouton & un bouton sélectionné respectivement (image)

Code:

a.sceditor-button
        {
  background-color: #000 !important;
        }

Code:

a.sceditor-button.hover
        {
  background-color: #000 !important;
        }

Vous pardonnerez ma mise en page basique, mais actuellement en "réponse normal" je n'ai pas d'éditeur de texte et du coup je suis prise au dépourvu pour vous faire quelque chose de simple sans me lancer dans du HTML. J'ai séparé tous les codes volontairement alors que certains pourraient être regroupés, ayant les mêmes propriétés, mais cela vous permet dans un premier instant de séparer et bien définir chaque élément. Je rajouterai d'autres astuces pour styliser d'autres partie de l'éditeur de texte, plus tard dans la journée.

MISE À JOUR

La solution pour modifier la couleur de la police en mode "What you see is what you get" a été trouvée. Il s'agit là d'une manipulation javascript, à appliquer sur toutes les pages. Il vous suffit de modifier "a3a3a3" par le code couleur de votre choix.

Script à mettre comme ceci panneau d'administration > modules > gestion des pages javascript > nouvelle page > afficher sur tous les pages (grosso modo. J'suis pas allée vérifiée le nom exact des onglets.)

Code:

$(document).ready(function() {
        $('div.sceditor-container.ltr.wysiwygMode iframe').ready(function() {
            $('div.sceditor-container.ltr.wysiwygMode iframe').contents().find('p').css('color','#a3a3a3').css('font-size', '11px');
        });
});


Astuce trouvée par Adam_sfp sur le forum des forums.

PROBLEMES

SI VOUS AVEZ UN QUELCONQUE PROBLEME D'AFFICHAGE DE VOTRE EDITEUR DE TEXTE, veuillez lire ce sujet impérativement: http://forum.forumactif.com/t352401-nouvel-editeur-de-messages-pour-les-forums-forumactif#3002012 . Si vous avez modifié le template Poster & Messages Privés > Posting_body il vous faudra le réinitialiser.


Si vous avez un problème d'affiche de cet ordre-ci:

Spoiler:

C'est alors le template "viewtopic_body" qui est en cause, il vous faudra le réinitialiser lui aussi, et retravailler dessus.

Code:

        function selectCode(a){a=a.parentNode.tagName==="B"?$(a).closest("table").find(".cont_code")[0]:$(a).closest("dl").find("code")[0];if(window.getSelection){var c=window.getSelection();if(c.setBaseAndExtent)c.setBaseAndExtent(a,0,a,a.innerText.length-1);else{window.opera&&a.innerHTML.substring(a.innerHTML.length-4)=="<BR>"&&(a.innerHTML+=" ");var b=document.createRange();b.selectNodeContents(a);c.removeAllRanges();c.addRange(b)}}else document.getSelection?(c=document.getSelection(),b=document.createRange(),b.selectNodeContents(a),
        c.removeAllRanges(),c.addRange(b)):document.selection&&(b=document.body.createTextRange(),b.moveToElementText(a),b.select())}
       
        $(function(){
            $("dl.codebox:not(.spoiler,.hidecode) dt").add($("div.cont_code").closest("table").find("span.genmed b")).append('<span onClick="selectCode(this)" class="selectCode">Sélectionner le contenu</span>');
        });

Code:

        .selectCode { float:right; text-transform: uppercase; cursor:pointer; }

Code:

<form>
<select style="width: 200px" onchange="location = this.options
[this.selectedIndex].value">
<option selected="selected">
Rosebud's options
</option>


<option value="URL1">
TITRE1
</option>

 <option value="URL2">
TITRE2
</option>

</select>
</form>

Code:

</option>

Code:

<option value="URL">
TITRE
</option>

Code:

.postdetails.poster-profile a img {
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;

  border: 5px solid #COULEUR DU CONTOUR;
}

PREMIER : Coin haut gauche
SECOND : Coin haut droit
TROISIÈME : Coin bas droit
QUATRIEME : Coin bas gauche.

Code:

 
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;

  border-radius: 10px;


Code:

.postdetails.poster-profile a img {
  border-radius: 10px 10px 10px 10px;
  border: 5px solid #COULEUR DU CONTOUR;
}