AccueilFAQRechercherMembresGroupesS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.


    Catégories en un bloc

    Partagez
    avatar
    NyoTheNeko
    FémininAge : 23Messages : 5018

    le Mar 1 Juil 2014 - 0:20

    Rappel du premier message :

    Catégories



    Ceci est un code de catégories crée suite à la Demande de Risa, ici.

    Pour phbb2 ▬ CSS3 & HTML5 ▬ Code mit sous hide ▬ Ce que ça donne


    Les effets et images


    Le carré noir tout à gauche est l'image de nouveaux/pas de nouveaux messages et est en 75px de largeur et 90px de hauteur.
    Le second carré noir (légèrement transparent) est l'image de description de catégories et est en 130px de largeur et 70px de hauteur. Vous pouvez également le mettre en 90px de hauteur (pour qu'il soit de la même hauteur que le reste) mais vous devrez alors changer quelque peu sa position dans le CSS (cf. indications plus bas). Au passage de la souris, l'image va d'une opacité de 70% à 100%.
    Il y a un overflow: auto aussi bien sur la description que sur la liste des sous-forums. Cependant, sur certains navigateurs, la barre ne se voit pas pour les sous-forums (notamment Firefox).
    Tous les liens ont un effet au passage de la souris (le texte s'allonge et change de couleur).
    L'écriture spéciale utilisée est Nothing You Could Do. Vous retrouvez son link juste au-dessus de BEGIN catrow. Vous pouvez la changer/retirer, mais pensez alors à retirer ou changer chacune de ses apparitions dans le CSS (sous la forme de font-family: 'Nothing You Could Do')!

    Le code


    Code HTML à placer dans Affichage -> Page d'accueil -> Templates -> Général -> index_box /!\ Attention!: C'est le template en entier! /!\ :


    Code HTML à placer dans chaque description de catégories :


    Le CSS:


    Pour mettre l'image de description à 90px et bien la placer


    Le code correspondant est celui-ci et vous verrez que tout est déjà indique dans le CSS::


    Cependant, pour être plus claire, voilà ce qui est à mettre exactement, si seul la hauteur de cette image change:



    avatar
    Pààm
    FémininAge : 25Messages : 3

    le Mer 27 Aoû 2014 - 16:54

    Géant ! Ce que je cherchais. Je n'oublierai pas de vous créditer, merci beaucoup ! (:
    avatar
    missphan
    FémininAge : 34Messages : 154

    le Ven 29 Aoû 2014 - 14:31

    superbe merci beaucoup
    avatar
    MOON LEE
    FémininAge : 23Messages : 146

    le Ven 29 Aoû 2014 - 15:06

    merci
    avatar
    Layla4
    FémininAge : 18Messages : 149

    le Sam 6 Sep 2014 - 19:36

    Merci !
    avatar
    Frosty Blue
    FémininAge : 21Messages : 161

    le Dim 7 Sep 2014 - 10:29

    Merci beaucoup ^^
    avatar
    Saphire
    FémininAge : 19Messages : 146

    le Dim 7 Sep 2014 - 10:29

    Tres beau merci
    avatar
    Insanities
    FémininAge : 22Messages : 40

    le Ven 19 Sep 2014 - 4:08

    Merci du partage !



    avatar
    Miyoko
    FémininAge : 25Messages : 213

    le Mer 24 Sep 2014 - 22:50

    Merci



    avatar
    Faucon
    FémininAge : 17Messages : 64

    le Dim 28 Sep 2014 - 17:15

    Super, merci ♥
    avatar
    Kikton
    MasculinAge : 21Messages : 28

    le Lun 29 Sep 2014 - 10:38

    Très jolie , j'adore
    avatar
    picka234
    Age : 52Messages : 440

    le Jeu 16 Oct 2014 - 14:53

    merci!!



    avatar
    lolosmile
    FémininAge : 26Messages : 37

    le Jeu 16 Oct 2014 - 20:08

    merci beaucoup
    avatar
    plushmasters
    FémininAge : 25Messages : 70

    le Mar 21 Oct 2014 - 9:56

    trop beau <3
    avatar
    Merwyn Arehdel
    FémininAge : 17Messages : 298

    le Dim 26 Oct 2014 - 13:54

    Merci ! ♥



    Just want to be yours.
    avatar
    Lisou
    FémininAge : 17Messages : 299

    le Mar 28 Oct 2014 - 10:31

    Merci ♥
    avatar
    benficagirl
    FémininAge : 31Messages : 306

    le Sam 8 Nov 2014 - 3:53

    Merci :) j'aime bien :).
    avatar
    Hayate747
    MasculinAge : 27Messages : 196

    le Sam 8 Nov 2014 - 10:25

    Merci
    avatar
    Storminder
    MasculinAge : 21Messages : 56

    le Dim 9 Nov 2014 - 16:57

    Merci beaucoup !
    avatar
    Vaast
    MasculinAge : 24Messages : 15

    le Dim 9 Nov 2014 - 18:23

    Merci !
    avatar
    Azzuen
    FémininAge : 19Messages : 61

    le Jeu 20 Nov 2014 - 0:01

    Merciii!
    avatar
    Kau
    FémininAge : 15Messages : 148

    le Jeu 20 Nov 2014 - 17:09

    Elles sont trop cool, merci.
    avatar
    Invité

    le Jeu 20 Nov 2014 - 23:15

    Merci !
    avatar
    Porcelain Detox
    MasculinAge : 22Messages : 89

    le Dim 30 Nov 2014 - 17:21

    Merci <3
    avatar
    Raziel Dirty
    MasculinAge : 20Messages : 38

    le Dim 30 Nov 2014 - 19:40

    Merci !
    avatar
    petit lu
    FémininAge : 25Messages : 170

    le Lun 8 Déc 2014 - 18:24

    Un grand merci pour le partage
    très magnifique code ♥
    Contenu sponsorisé


      La date/heure actuelle est Mar 17 Oct 2017 - 15:15