AccueilDernières imagesRechercherS'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.

Le Deal du moment :
TV LED 32” Continental Edison CELED32SAHD24B3
Voir le deal
139.99 €

    Show me the meaning of being lonely

    A-Lice
    A-Lice
    FémininAge : 29Messages : 4939

    Ven 13 Fév 2015 - 23:49

    Rappel du premier message :


    Show me the meaning of being lonely


    Voici une page d'accueil avec transition pour le staff.

    Je précise que l'arrière plan gris correspond à mon forum.

    HTML & CSS ~ Voici donc un aperçu : www & au passage de la souris ~ Invision


    Et le code :
    HTML :
    Code:
    <div class="PA_fond"><div class="PA_titre02">Show me the meaning of being lonely ~</div><div class="PA_titre01">Contexte</div><div class="PA_contexte">Texte ici
    </div><div class="PA_titre01">Staff</div><div class="PA_staff"><div class="PA_staff02"><div class="PA_staff03">Pseudo - Rang - Fonction</div><img src="LIEN DE L'IMAGE" /></div>

    </div><div class="PA01"></div>
    <br />
    <div class="PA_titre01">What else ?</div><div class="PA_liens">Règlement<br />Contexte<br />Autres liens ~ 
    </div><div class="PA_titre01">News</div><div class="PA_news">00/00/00 : Cras volutpat at elit non aliquam.<br />

    </div><div class="PA01"></div>
    <div class="PA_titre01">Prédéfinis</div><div class="PA_predef"><img src="LIEN DE L'IMAGE" />

    </div>
    <a href="http://www.never-utopia.com" id="PA_alice">A-Lice | Never-Utopia</a>
    </div>


    CSS :
    Code:
    .PA01 {
    clear: both;
    }

    .PA_fond {
    width: 680px;
    height: 390px;
    padding: 10px;
    border-radius: 50px;
    border: solid 2px #b07865;
    margin: auto;
    background: #f6d7cd;
    color: #5B214F;
    font-size: 12px;
    }

    .PA_titre01 {
    text-indent: 70px;
    font-size: 20px;
    font-weight: bold;
    color: #b73d44;
    margin-top: -10px;
    }

    .PA_contexte {
    float: left;
    width: 270px;
    height: 150px;
    overflow: auto;
    background: #b07865;
    text-align: justify;
    padding: 5px;
    border-radius: 20px;
    margin-right: 20px;
    }

    .PA_titre02 {
    text-align: right;
    font-size: 35px;
    color: #d4457d;
    text-shadow: 1px 1px 0px #b07865;
    margin-top: -25px;
    margin-left: 270px;
    width: 400px;
    }

    .PA_staff {
    width: 350px;
    height: 140px;
    background: #b07865;
    text-align: justify;
    padding: 5px;
    float: right;
    overflow: auto;
    }

    div.PA_staff02 {
    width: 100px;
    height: 70px;
    overflow: hidden;
    display: inline-block;
    }

    .PA_staff02 img {
    width: 100px;
    height: 70px;
    position: relative;
    bottom: 50px;
    transition: 2s;
    }

    .PA_staff02:hover img {
    bottom: 140px;
    transition: 2s;
    }

    .PA_staff03 {
    padding: 5px;
    text-align: center;
    }

    .PA_liens {
    float: left;
    width: 270px;
    height: 80px;
    background: #b07865;
    text-align: center;
    padding: 5px;
    }

    .PA_news {
    float: right;
    width: 350px;
    height: 100px;
    background: #b07865;
    text-align: justify;
    padding: 5px;
    border-radius: 20px;
    }

    .PA_predef {
    width: 650px;
    height: 50px;
    padding: 5px;
    margin: auto;
    overflow: hidden;
    }

    #PA_alice {
    text-decoration: none;
    color: white;
    font-size: 11px;
    text-align: center;
    display: block;
    }

    Remarque : Pour une utilisation optimale, la taille des images pour le staff est de 100px par 70px, pour les prédéfinis elle est de 50px par 50px.

    Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
    Vos commentaires et remerciements sont toujours bienvenus ^^
    Si vous avez des problèmes avec ce LS, venez poster ici.

    Ganta
    Ganta
    MasculinAge : 31Messages : 69

    Mar 26 Avr 2016 - 23:27

    Merci !
    Harmonia
    Harmonia
    FémininAge : 26Messages : 110

    Mar 24 Mai 2016 - 7:11

    C'est super beau merci !
    pimslady
    pimslady
    FémininAge : 34Messages : 71

    Ven 17 Juin 2016 - 16:22

    super merci !!
    Mazette
    Mazette
    FémininAge : 28Messages : 8

    Lun 20 Juin 2016 - 16:10

    C'est un tableau simple mais très pratique ! Merci du partage :)
    Loona
    Loona
    FémininAge : 56Messages : 22

    Dim 7 Aoû 2016 - 9:05

    Merci



    Show me the meaning of being lonely - Page 2 Signat10
    Tchii
    Tchii
    FémininAge : 38Messages : 285

    Dim 16 Oct 2016 - 12:11

    Coucou!
    Merci pour le petit code.
    Et bravo pour le travail.
    A trés vite!
    Tchii
    Neya
    Neya
    FémininAge : 24Messages : 164

    Dim 23 Oct 2016 - 12:04

    merci
    Bryan1997
    Bryan1997
    MasculinAge : 26Messages : 51

    Ven 28 Oct 2016 - 19:45

    merci
    Chadot
    Chadot
    FémininAge : 35Messages : 248

    Mer 2 Nov 2016 - 18:38

    Merci



    Show me the meaning of being lonely - Page 2 2mo6y5k
    Waize
    Waize
    FémininAge : 26Messages : 34

    Lun 7 Nov 2016 - 1:40

    merci
    Solitude
    Solitude
    FémininAge : 48Messages : 294

    Dim 13 Nov 2016 - 10:34

    Merci



    ~ Je suis capable du meilleur comme du pire, mais dans le pire c'est moi la meilleure. ~
    Show me the meaning of being lonely - Page 2 Sign510
    Tink ♥
    Tink ♥
    FémininAge : 31Messages : 66

    Lun 14 Nov 2016 - 22:52

    hey c'est joli merci !! Very Happy
    Patdrue
    Patdrue
    FémininAge : 34Messages : 158

    Mar 15 Nov 2016 - 18:31

    merci
    Ikigami
    Ikigami
    FémininAge : 35Messages : 37

    Mer 16 Nov 2016 - 23:12

    merci :)
    Chhaya
    Chhaya
    FémininAge : 38Messages : 1213

    Sam 26 Nov 2016 - 16:23

    Merci ♥



    Show me the meaning of being lonely - Page 2 200412081714641513

      Merci Sparrow :3
    Sylfaen
    Sylfaen
    FémininAge : 25Messages : 70

    Dim 4 Déc 2016 - 15:49

    thank's =)
    Nathouille
    Nathouille
    FémininAge : 32Messages : 70

    Dim 29 Jan 2017 - 22:45

    Je vais tester ^^ Mais les liens sont morts pour la prévisualisation...
    Lalia
    Lalia
    FémininAge : 24Messages : 45

    Sam 25 Fév 2017 - 15:19

    Merci *o*
    defenrir
    defenrir
    MasculinAge : 41Messages : 105

    Sam 25 Fév 2017 - 21:02

    merci =)
    Nyptia
    Nyptia
    FémininAge : 32Messages : 38

    Lun 3 Avr 2017 - 9:05

    Bonjour, les aperçus ne fonctionnent pas chez moi Sad
    Chadot
    Chadot
    FémininAge : 35Messages : 248

    Lun 8 Mai 2017 - 7:07

    Merci



    Show me the meaning of being lonely - Page 2 2mo6y5k
    Leelo
    Leelo
    FémininAge : 32Messages : 157

    Dim 21 Mai 2017 - 18:25

    merci
    Momiji-chan
    Momiji-chan
    FémininAge : 25Messages : 38

    Jeu 22 Juin 2017 - 22:36

    Merci :)
    Kaleessi
    Kaleessi
    FémininAge : 31Messages : 78

    Jeu 20 Juil 2017 - 2:23

    Mercii du partage! :)
    Foenor
    Foenor
    MasculinAge : 31Messages : 7

    Sam 22 Juil 2017 - 16:44

    Apparemment, on l'a déjà signalé, mais les liens pour les aperçus sont morts Wink

    Merci pour le partage quoi qu'il en soi :)
    Contenu sponsorisé


      La date/heure actuelle est Mer 28 Fév 2024 - 20:47