Modèle:Tabs : Différence entre versions

Version du 18 novembre 2020 à 16:04

Tab#1: Le modèle Tabs
Ceci est l'onglet actif

Tab#2 Le modèle Tab
Cet onglet est inactif

Ce modèle est conçu pour assembler un ensemble d'onglets (10 au plus) semblables à ceux du haut de cette page. Ce modèle utilise le «sous-modèle» Tab; On explique le fonstionnement sur l'exemple de cette mêmepage.

Code de cette page

 {{Tabs
|bord=2px solid #{{ColorAtys|type=dark|group=tryker}}
|bg_frame=#{{ColorAtys|type=bg|group=tryker}}
|round=5em
|align_tab=center
<!--  -->
|Tab-1={{3DText|text='''Tab#1: Le modèle Tabs<br />Ceci est l'onglet ''actif'''''}} 
|URL-1=Modèle:Tabs 
|bg_Tab-1=#{{ColorAtys|type=light|group=tryker}}
|Pic-1=dummy.png 
<!--  -->
|Tab-2={{3DText|text='''''Tab#2 Le modèle Tab'''''<br />Cet onglet est ''inactif''}}
|URL-2=Modèle:Tab
|bg_Tab-2=#{{ColorAtys|type=light|group=fyros}}
|Pic-2=UnderConstruction.png
}}

Code détaillé

**Code expliqué**
`Code`	Effet	Étendue de l'effet
`{{Tabs`	-	Début de l'appel du modèle.
`\|bord=2px solid #{{ColorAtys\|type=dark\|group=tryker}}`	definit le style de ligne du cadre, son épaisseur et sa couleur	La page entière encadrée.
`\|bg_frame=#{{ColorAtys\|type=bg\|group=tryker}}`	definit la couleur du fond (bg) du corps de la page : ici bleu tryker blue comme défini dans le modèle ColorAtys.
`\|round=5em`	Rayon des coins arrondiss Notez que seuls les coins des onglets sont arrondis.
`\|align_tab=center`	Alignement du noms des onglets.
`<!-- -->`	Commentaire vide(separateur)	rend le code plus facile à lire.
`\|Tab-1={{3DText\|text='''Tab#1: Le modèle Tabs<br />Ceci est l'onglet ''actif'''''}}`	Nom de l'onglet	Cet onglet seulement Notez que les paramètres sont numérotés.On peut avoir jusquà 10 onglets de ce type.
`\|URL-1=Modèle:Tabs`	Le nom de la page dans lequel l'onglet est "actif". L' url est celle de cette page et l'onglet est "actif", son fond est celui du corps de la page.
`\|bg_Tab-1=#{{ColorAtys\|type=light\|group=tryker}}`	Couleur du fond de l'onglet: ici bleu tryker «light», La couleur n'est effective que si l'url est différente de celle de la page actuelle.
`\|Pic-1=dummy.png`	Une icône que s'affiche à la gauche de l'onglet.
`<!-- -->`	separateur	rend le code plus facile à lire.
`\|Tab-2={{3DText\|text='''''Tab#2 Le modèle Tab'''''<br />Cet onglet est ''inactif''}}`	Nom du second onglet	Cet onglet seulement.
`\|URL-2=Modèle:Tab`	Cette page n'est pas la page actuelle, l'onglet est inactif les onglets «inactifs» sont séparés du corps de la page par une ligne horizontale.
`\|bg_Tab-2=#{{ColorAtys\|type=light\|group=fyros}}`	Couleur du fond de l'onglet: : ici orange fyros orange «light».
`\|Pic-2=UnderConstruction.png`	Icône du second onglet.
`}}`	-	Fin du modèle.

Examples

@@ Ligne 19 : / Ligne 19 : @@
   --></table><!--
-  --><div style="border:{{{bord|solid 2px #A3B1BF}}}; padding: .5em 1em 1em 1em; padding: 0em; border-top: none; background-color:{{{bg_frame|transparent}}}; color:#000;zoom: 1"><!--
+  --><div style="border:{{{bord|solid 2px #A3B1BF}}}; padding: .5em 1em 1em 1em; padding: 0em; border-top: none; background-color:{{{bg_frame|transparent}}}; color:#000;zoom: 1;overflow: hidden;"><!--
     --><div style="padding:1ex; "><!--

De EncyclopAtys

Version du 18 novembre 2020 à 16:04

Code de cette page

Code détaillé

Examples