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 : -16%
Aspirateur balai Dyson V15 Detect Absolute (2023)
Voir le deal
669 €

    Black & White

    Aelita
    Aelita
    FémininAge : 31Messages : 278

    Sam 8 Mar 2014 - 1:54

    Rappel du premier message :

    Bonjour,

    Voici une nouvelle page d'accueil. J'espère qu'elle vous plaira.

    La largeur est prédéfinie à 800px de largeur. Les srcolls externes de l'aperçu n'apparaissent pas dans l'original c'est parce que j'utilise un Iframe à cause du code.

    Aperçu:



    Code:
    /*titres*/

    .titres{
     display: inline-block;
     font-size: 25px;
     color: purple;
     margin-top: -15px;
     font-style: italic;
     max-width: 500px;
    }

    .titre_staff{
     font-size: 25px;
     color: purple;
     font-style: italic;
    }

    /*staff*/

    .staff{
     background-color: #000;
     width: 130px;
     height: 130px;
     border-radius: 200px;
     margin-top: 20px;
     color: #FFF;
     position: relative;
     z-index: 10;
     transition-duration: 10s;
    }

    .staff:hover{
     background-color: #000;
     width: 130px;
     height: 130px;
     border-radius: 200px;
     margin: 20px 130px 0 -130px;
     color: #FFF;
     position: relative;
     z-index: 10;
     transition-duration: 1s;
    }

    /*contenus globaux*/

    .contenu_ligne1{
     background-color: #000;
     border-radius: 50px;
     width: 180px;
     height: 180px;
     margin: 15px 5px 0 5px;
     color: #FFF;
    }

    .contenu_ligne2{
     background-color: #000;
     border-radius: 50px;
     height: 200px;
     margin: 15px 5px 0 5px;
     color: #FFF;
    }

    .contenu_ligne3{
     background-color: #000;
     border-radius: 20px;
     height: 50px;
     margin: 15px 5px 0 5px;
     color: #FFF;
    }

    /*images*/

    .predef_td{
     width: 82px;
     height: 82px;
     background-color: #FFF;
     border: 1px solid #FFF;
    }

    /*Textes*/

    .text{
     margin: 5px 15px 0 0;
     padding: 0 5px 0 10px;
     overflow: auto;
     height: 165px;
     text-align: justify;
    }

    .staff_text{
     position: relative;
     text-align: center;
     margin: 30px 0-75px 0;
     z-index: 30;
     color: #000;
    }

    /*partenaires*/

    .partenaire{
     background-color: #000;
     border-radius: 20px;
     width: 100%;
     height: 35px;
     color: #FFF;
     vertical-align: middle;
     padding: 10px 0 10px 0;
    }

    Code:
    <table border="0" width="800" height="50%" align="center">
     <tr>
     <td rowspan="3" width="20%" align="center">
     <span class="titre_staff">staff</span>
     <table cellspacing="10">
     <tr>
     <td align="center">
     <div class="staff_text"><center>NOM<br>Administrateur</center></div>
     <div class="staff"></div>
     </td>
     </tr>
     <tr>
     <td align="center">
     <div class="staff_text"><center>NOM<br>Administrateur</center></div>
     <div class="staff"></div>
     </td>
     </tr>
     <tr>
     <td align="center">
     <div class="staff_text"><center>NOM<br>Administrateurs</center></div>
     <div class="staff"></div>
     </td>
     </tr>
     </table>
     </td>
     <td width="26.6%" class="" align="center">
     <div class="contenu_ligne1">
     <span class="titres">infos</span>
     <div class="text">blablabla</div>
     </div>
     </td>
     <td width="26.6%" class="" align="center">
     <div class="contenu_ligne1">
     <span class="titres">liens</span>
     <div class="text">blablabla</div>
     </div>
     </td>
     <td width="26.6%" align="center">
     <div class="contenu_ligne1">
     <span class="titres">coups de coeurs</span>
     <table>
     <tr>
     <td><a href="" width="100" height="38.75"><img src="" width="100" height="38.75" border="1"></a></td>
     </tr>
     <tr>
     <td><a href="" width="100" height="38.75"><img src="" width="100" height="38.75" border="1"></a></td>
     </tr>
     <tr>
     <td><a href="" width="100" height="38.75"><img src="" width="100" height="38.75" border="1"></a></td>
     </tr>
     </table>
     </div>
     </td>
     </tr>
     <tr>
     <td colspan="3">
     <table border="0" width="100%">
     <tr>
     <td width="50%" align="center">
     <div class="contenu_ligne2">
     <span class="titres">Contexte</span>
     <div class="text">blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla blablabla </div>
     </div>
     </td>
     <td width="50%" align="center">
     <div class="contenu_ligne2">
     <span class="titres">Prédéfini</span>
     <table>
     <tr>
     <td class="predef_td"><a href="" width="82" height="82"><img src="" width="82" height="82"></a></td>
     <td class="predef_td"><a href="" width="82" height="82"><img src="" width="82" height="82"></a></td>
     <td class="predef_td"><a href="" width="82" height="82"><img src="" width="82" height="82"></a></td>
     </tr>
     <tr>
     <td class="predef_td"><a href="" width="82" height="82"><img src="" width="82" height="82"></a></td>
     <td class="predef_td"><a href="" width="82" height="82"><img src="" width="82" height="82"></a></td>
     <td class="predef_td"><a href="" width="82" height="82"><img src="" width="82" height="82"></a></td>
     </tr>
     </table>
     </div>
     </td>
     </tr>
     </table>
     </td>
     </tr>
     <tr>
     <td colspan="3">
     <table border="0" width="100%">
     <tr>
     <td width="50%" align="center">
     <div class="contenu_ligne3">
     <span class="titres">Topsites</span>
     <table>
     <tr>
     <td><a href="" width="30" height="30"><img src="http://th09.deviantart.net/fs71/PRE/f/2013/123/1/f/igniswind_logo_render_by_dbzartcostom-d63xkwz.png" width="30" height="30"></a></td>
     <td><a href="" width="30" height="30"><img src="http://th09.deviantart.net/fs71/PRE/f/2013/123/1/f/igniswind_logo_render_by_dbzartcostom-d63xkwz.png" width="30" height="30"></a></td>
     <td><a href="" width="30" height="30"><img src="http://th09.deviantart.net/fs71/PRE/f/2013/123/1/f/igniswind_logo_render_by_dbzartcostom-d63xkwz.png" width="30" height="30"></a></td>
     <td><a href="" width="30" height="30"><img src="http://th09.deviantart.net/fs71/PRE/f/2013/123/1/f/igniswind_logo_render_by_dbzartcostom-d63xkwz.png" width="30" height="30"></a></td>
     <td><a href="" width="30" height="30"><img src="http://th09.deviantart.net/fs71/PRE/f/2013/123/1/f/igniswind_logo_render_by_dbzartcostom-d63xkwz.png" width="30" height="30"></a></td>
     <td><a href="" width="30" height="30"><img src="http://th09.deviantart.net/fs71/PRE/f/2013/123/1/f/igniswind_logo_render_by_dbzartcostom-d63xkwz.png" width="30" height="30"></a></td>
     </tr>
     </table>
     </div>
     </td>
     <td width="50%" align="center">
     <div class="contenu_ligne3">
     <span class="titres">Crédits</span>
     <div class="text">©Code PA by Aelita</div>
     </div>
     </td>
     </tr>
     </table>
     </td>
     </tr>
     <tr>
     <td colspan="4">
     <div class="partenaire">
     <marquee direction="left" scrolldelay="1" scrollamount="2" height="45">
     <a href="" width="100" height="35"><img src="" width="100" height="35" /></a>
     <a href="" width="100" height="35"><img src="" width="100" height="35" /></a>
     <a href="" width="100" height="35"><img src="" width="100" height="35" /></a>
     <a href="" width="100" height="35"><img src="" width="100" height="35" /></a>
     </marquee>
     </div>
     </td>
     </tr>
    </table>

    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.
    Jenova
    Jenova
    MasculinAge : 29Messages : 153

    Sam 11 Avr 2015 - 22:43

    C'est exactement ce que je cherchais merci =D!!!



    Black & White - Page 5 I3k3
    Azorus
    Azorus
    MasculinAge : 22Messages : 35

    Lun 27 Avr 2015 - 15:55

    mercii cette PA est parfaite, ni trop compliquée, ni moche GG



    Seul mon nounours peut me comprendre :cowboy: :gentleman: :bandit:


    GFX by Aleph'
    Féery
    Féery
    FémininAge : 24Messages : 23

    Dim 3 Mai 2015 - 21:30

    Merci beaucoup <3
    pika-cerise
    pika-cerise
    FémininAge : 32Messages : 92

    Sam 6 Juin 2015 - 18:43

    merci
    Orange Sanguine
    Orange Sanguine
    FémininAge : 28Messages : 86

    Dim 7 Juin 2015 - 17:56

    La PA est superbe merci ^^



    Black & White - Page 5 Sans_t11
    Nutop
    Nutop
    FémininAge : 21Messages : 254

    Ven 19 Juin 2015 - 22:47

    Merci, je vais tester ça ^^




    Black & White - Page 5 Mini_597402Sceaufinal

    avatar
    Hane
    FémininAge : 25Messages : 70

    Lun 29 Juin 2015 - 2:10

    abracadabra merci merci!
    Maxine Evans
    Maxine Evans
    FémininAge : 30Messages : 94

    Sam 4 Juil 2015 - 19:26

    merci
    Luunalight
    Luunalight
    FémininAge : 33Messages : 98

    Dim 19 Juil 2015 - 20:16

    Merci
    Marion Navi
    Marion Navi
    FémininAge : 30Messages : 183

    Jeu 15 Oct 2015 - 16:30

    merci
    Anonymous
    Invité

    Jeu 15 Oct 2015 - 18:21

    Merci pour le partage ! ⊙▂⊙
    Whit
    Whit
    FémininAge : 26Messages : 154

    Dim 25 Oct 2015 - 15:58

    Merci =3
    Kira Hatsuki
    Kira Hatsuki
    FémininAge : 22Messages : 152

    Ven 30 Oct 2015 - 20:45

    Merci ! :3
    Pythia
    Pythia
    FémininAge : 35Messages : 183

    Lun 16 Nov 2015 - 17:39

    Simple et efficace merci du partage :)



    Black & White - Page 5 Neo10
    Roxane.D
    Roxane.D
    FémininAge : 26Messages : 29

    Mar 17 Nov 2015 - 18:22

    Merci!! :)
    Haru-Raka
    Haru-Raka
    FémininAge : 36Messages : 38

    Mar 17 Nov 2015 - 21:28

    je teste o/
    sweetheart.
    sweetheart.
    FémininAge : 36Messages : 120

    Ven 20 Nov 2015 - 14:39

    Merci



    Un bisou pour Invité


    Un bisou pour...
    Invité
    Rhoswen Fay
    Rhoswen Fay
    FémininAge : 37Messages : 66

    Sam 21 Nov 2015 - 1:01

    merci !
    Camomille
    Camomille
    FémininAge : 20Messages : 62

    Mar 29 Déc 2015 - 23:20

    Aaaah .. C'est juste T R O P BE A U
    Lilie
    Lilie
    FémininAge : 40Messages : 190

    Mer 30 Déc 2015 - 8:56

    Mercii :)
    Kitket
    Kitket
    FémininAge : 40Messages : 106

    Jeu 31 Déc 2015 - 9:44

    Merci
    Voltino
    Voltino
    MasculinAge : 29Messages : 55

    Sam 16 Jan 2016 - 2:24

    Merci
    BlackArrow
    BlackArrow
    MasculinAge : 26Messages : 17

    Mer 3 Fév 2016 - 14:19

    Merci
    Darouine Lius
    Darouine Lius
    MasculinAge : 34Messages : 77

    Mar 23 Fév 2016 - 19:26

    Oh c'est superbe :)
    Kilda
    Kilda
    FémininAge : 43Messages : 73

    Mer 24 Fév 2016 - 17:31

    MERCI
    Contenu sponsorisé


      La date/heure actuelle est Mar 18 Juin 2024 - 7:44