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.


    Pirate's Life

    Partagez
    avatar
    Halloween
    FémininAge : 24Messages : 9752

    le Mar 26 Aoû 2014 - 17:03

    Rappel du premier message :

    Plop,

    Un petit pack mi-pirate mielleux, mi-fantaisie ! Illustration des personnages taille 100*57px, illustration des nouveautés taille 300*150px.

    Avatars piochés sur Penguin Factory et illustrations trouvées sur Zérochan ou We Heart It, merci à eux !



    Page d'accueil


    HTML ▬ PhpBB 2

    Catégories ici ▬ QEEL ici ▬ Règlement ici ▬ Contexte ici ▬ Règlement ici ▬ Nouveautés & Annonces ici ▬ Relations ici ▬ Présentation ici ▬ Prédéfinis ici ▬ Liste des RP ici ▬ Contenu RP ici ▬ En-tête RP ici

    Aperçu ▬ Simple | Au survol


    CSS
    Code:
    /* --------------------------------- PA --------------------------------- */

    /* Fond de la PA */
    .fond_PA {
      padding: 15px;
      background-color: #EAEAEA;
      width: 720px;
      border-radius: 25px 0px 25px 0px;
      top: -0.9em;
      position: relative;
    }

    /* Titre de la PA */
    .titre_PA {
      font-size: 30px;
      font-family: 'Permanent Marker', cursive;
      color: #E2922E;
      padding-left: 35px;
      text-align: left;
    }

    /* Contexte */
    .contexte_PA {
      background-color: #8CDC73;
      width: 250px;
      padding: 15px;
      color: #ffffff;
      text-align: justify;
      font-size: 12px;
      position: relative;
      top: -0.5em;
    }

    /* Titre du contexte */
    .titre_PA2 {
      font-size: 25px;
      font-family: 'Lobster', cursive;
      color: #348796;
      padding-left: 35px;
    }

    /* Bloc staff */
    .staff_PA {
      background-color: #F7D772;
      width: 250px;
      padding: 15px;
      color: #E2922E;
      font-family: 'Archivo Narrow', sans-serif;
      font-size: 18px;
    }

    /* Bloc de chaque personnage du staff */
    .contenu_staff {
      color: #E2922E;
      font-family: 'Archivo Narrow', sans-serif;
      font-size: 18px;
    }

    /* Bloc informations */
    .bloc_info_PA {
      width: 187px;
      height: 40px;
      padding: 10px;
      background-color: #FF6C6C;
    }

    /* Liens de navigation rapide */
    .liens_PA {
      font-size: 14px;
      text-align: center;
      font-family: 'Archivo Narrow', sans-serif;
    }

    /* Nouveautés au survol de l'image */
    .new_PA {
      width: 300px;
      height: 150px;
      overflow: hidden;
      background-color: #91C5CA;
    }

    .new_PA_img {
      position: relative;
      z-index: 2;
      width: 300px;
      height: 150px;
      margin-left: 0px;
      transform: all;
      -moz-transform: all;
      -o-transform: all;
      -htm-transform: all;
      -webkit-transform: all;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }

    .new_PA:hover .new_PA_img {
      margin-left: 400px;
      transform: all;
      -moz-transform: all;
      -o-transform: all;
      -htm-transform: all;
      -webkit-transform: all;
      transition: 1s;
      -moz-transition: 1s;
      -o-transition: 1s;
      -htm-transition: 1s;
      -webkit-transition: 1s;
    }

    .new_PA_description {
      position: relative;
      z-index: 1;
      width: 280px;
      height: 110px;
      margin-top: -150px;
      text-align: justify;
      font-size: 11px;
      color: #FEFEFE;
      padding: 15px;
      overflow: auto;
    }

    /* Illustration "mouette" */
    .img_PA {
      width: 100px;
    }

    /* --------------------------------- FIN PA --------------------------------- */

    PA
    Code:
    <div class="titre_PA">
                                                 Bienvenue Marin d'eau douce !                                         
    </div>
    <div class="fond_PA">
                                                                                        
       <table>
                                                                                           
          <tbody>
                                                                                              
             <tr>
                                                                                                                                                     
                <td>
                                                             <span class="titre_PA2">Contexte</span>                                         
                   <div class="contexte_PA">
                                                                Feritas ire causam praefectus trusus quam praetorio ad ipse tempestate trusus quem in exagitabat enim discrimen discrimen est saevum coalito impedita quam convectio convectio ordinarias causam sit ire ire et monstraret saevum ut et monstraret annonae more annonae enim quam sit simul ire coalito quam et et impedita semper simul coalito. <a href="#" style="color: #257B1C !important;">Mais encore ?</a>                                         
                   </div>
                                                     <br />                                 
                   <div class="titre_PA2">
                                                                Staff                                         
                   </div>
                                                                                                    
                   <div class="staff_PA">
                                                                                                       
                      <table>
                                                                                                          
                         <tbody>
                                                                                                             
                            <tr>
                                                                                                                
                               <td>
                                                                                                                   
                                  <center>
                                                                               <img src="http://i39.servimg.com/u/f39/18/47/68/10/111.png" style="border: 2px solid #ffffff;" /><span class="contenu_staff"><span style="color: #AF1A15;">Jack Le Requin</span> <br /><span style="font-size: 16px;"><a href="#" style="color: #188D9F !important;">MP</a> • Rang • <span style="color: #44A029;">Statut</span></span> </span>                                         
                                  </center>
                                                                                                                   
                               </td>
                                                                                                                
                               <td>
                                                                                                                   
                                  <center>
                                                                               <img src="http://i39.servimg.com/u/f39/18/47/68/10/211.png" style="border: 2px solid #ffffff;" /><span class="contenu_staff"><span style="color: #188D9F;">Milo The Kid</span> <br /><span style="font-size: 16px;"><a href="#" style="color: #188D9F !important;">MP</a> • Rang • <span style="color: #44A029;">Statut</span></span> </span>                                           
                                  </center>
                                                                                                                   
                               </td>
                                                                                                                
                            </tr>
                                                                                                             
                         </tbody>
                                                                                                          
                      </table>
                                                                                                       
                   </div>
                                                                                                    
                </td>
                                                                     
                <td>
                                                   <img src="http://i39.servimg.com/u/f39/18/47/68/10/goelis10.png" class="img_PA" />                                 
                </td>
                                                                                       
                <td>
                                                                                        
                   <div class="titre_PA2">
                                              News                       
                   </div>
                                                                    
                   <div class="new_PA">
                                                                 
                      <div class="new_PA_img">
                                                       <img src="http://i39.servimg.com/u/f39/18/47/68/10/axis_p12.png" style="width: 300px;" />                         
                      </div>
                                                                               
                      <div class="new_PA_description">
                                                       Nec minus feminae quoque calamitatum participes fuere similium. nam ex hoc quoque sexu peremptae sunt originis altae conplures, adulteriorum flagitiis obnoxiae vel stuprorum. inter quas notiores fuere Claritas et Flaviana, quarum altera cum duceretur ad mortem, indumento, quo vestita erat, abrepto, ne velemen quidem secreto membrorum sufficiens retinere permissa est. ideoque carnifex nefas admisisse convictus inmane, vivus exustus est. Nec minus feminae quoque calamitatum participes fuere similium. nam ex hoc quoque sexu peremptae sunt originis altae conplures, adulteriorum flagitiis obnoxiae vel stuprorum. inter quas notiores fuere Claritas et Flaviana, quarum altera cum duceretur ad mortem, indumento, quo vestita erat, abrepto, ne velemen quidem secreto membrorum sufficiens retinere permissa est. ideoque carnifex nefas admisisse convictus inmane, vivus exustus est.                     
                      </div>
                                                               
                   </div>
                                                                            
                   <div style="clear: both;">
                                                                               
                   </div><br /><br />                 
                   <center>
                                          <span style="color: #503636; font-size: 12px;"><a href="#" class="liens_PA" style="color: #EE5148 !important;">Contexte</a> ☁ <a href="#" class="liens_PA" style="color: #E3922E !important;">Règlement</a> ☁ <a href="#" class="liens_PA" style="color: #4AA029 !important;">FAQ</a> ☁ <a href="#" class="liens_PA">Partenariat</a>    </span>                 
                   </center>
                                           <br /><br />         
                   <table>
                                               
                      <tbody>
                                                  
                         <tr>
                                                     
                            <td>
                                                    
                               <div class="bloc_info_PA">
                                          ⚓ Avatars Mangas<br />⚓ RPG type Pirates, vivons nos rêves !<br />⚓ Pseudo sous forme "Prénom NOM"       
                               </div>
                                                  
                            </td>
                                     
                            <td>
                                     <a href="#"><img src="http://i39.servimg.com/u/f39/18/47/68/10/1_110.png" style="border: 2px solid #ffffff;" /></a>     
                            </td>
                                       
                         </tr>
                                                  
                      </tbody>
                                               
                   </table>
                              
                   <div style="white-space: nowrap;">
                            <a href="#"><img src="http://i39.servimg.com/u/f39/18/47/68/10/2_210.png" style="border: 2px solid #ffffff;" /></a> <a href="#"><img src="http://i39.servimg.com/u/f39/18/47/68/10/310.png" style="border: 2px solid #ffffff;" /></a> <a href="#"><img src="http://i39.servimg.com/u/f39/18/47/68/10/410.png" style="border: 2px solid #ffffff;" /></a>       
                   </div>
                                                                        
                </td>
                                                                                                 
             </tr>
                                                                                              
          </tbody>
                                                                                           
       </table><br />
       <p align="right">
           <a href="http://www.never-utopia.com" class="crédits">© Halloween</a>
       </p>
    </div><link href="http://fonts.googleapis.com/css?family=Archivo+Narrow|Permanent+Marker|Playball|Lobster|Courgette" rel="stylesheet" type="text/css" />



    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.




    < / Libre service codage >
    avatar
    Pava
    FémininAge : 83Messages : 62

    le Dim 5 Juil 2015 - 19:17

    Super, merci ! ^^
    avatar
    Petit poisson
    FémininAge : 22Messages : 35

    le Dim 12 Juil 2015 - 22:14

    Merci
    avatar
    Wonder
    FémininAge : 20Messages : 20

    le Lun 13 Juil 2015 - 23:05

    Très chouette, merci du partage ^^
    avatar
    Neymar
    MasculinAge : 20Messages : 138

    le Mar 14 Juil 2015 - 0:59

    Yeah :DD
    avatar
    Saya Shirayuki
    FémininAge : 25Messages : 150

    le Jeu 16 Juil 2015 - 14:07

    Merci !
    avatar
    Megabroly
    MasculinAge : 26Messages : 118

    le Jeu 16 Juil 2015 - 15:29

    Super beau ! Merci beaucoup ^^ !



    avatar
    Akina-chan
    FémininAge : 24Messages : 138

    le Lun 20 Juil 2015 - 20:11

    Merci <3
    avatar
    Turkuaz
    MasculinAge : 26Messages : 21

    le Mar 21 Juil 2015 - 1:42

    Merci pour tout !!




    | Le vrai courage c'est de rester juste toute une vie. |
    avatar
    rosebleudu10
    FémininAge : 28Messages : 188

    le Lun 27 Juil 2015 - 16:10

    merci
    avatar
    Elwana
    FémininAge : 21Messages : 42

    le Jeu 30 Juil 2015 - 18:45

    Merciiiii, c'est très beau !
    avatar
    nekoanne-so
    FémininAge : 23Messages : 20

    le Ven 31 Juil 2015 - 17:29

    très joli ^w^
    avatar
    Amacky
    FémininAge : 26Messages : 133

    le Lun 3 Aoû 2015 - 17:48

    Merci :)
    avatar
    Kelalin
    FémininAge : 25Messages : 1888

    le Lun 3 Aoû 2015 - 19:02

    Merci pour ce code (^_^)
    avatar
    NanoiHime
    FémininAge : 19Messages : 562

    le Lun 24 Aoû 2015 - 14:50

    Merci



    avatar
    Likilou
    MasculinAge : 24Messages : 301

    le Mar 25 Aoû 2015 - 23:14

    merci



    avatar
    Shuu-Shuu
    FémininAge : 22Messages : 196

    le Mar 25 Aoû 2015 - 23:50

    merci beaucoup pour cette PA Very Happy
    Alancar
    MasculinAge : 20Messages : 57

    le Mer 26 Aoû 2015 - 1:35

    Merci beaucoup :)
    avatar
    Espoir
    FémininAge : 23Messages : 54

    le Ven 28 Aoû 2015 - 13:38

    Merci !
    avatar
    Antithée
    FémininAge : 21Messages : 69

    le Dim 30 Aoû 2015 - 16:08

    C'est beeeauu <3
    avatar
    DaZeli
    FémininAge : 22Messages : 377

    le Lun 31 Aoû 2015 - 1:56

    Merci
    avatar
    Sulivan-44
    MasculinAge : 23Messages : 65

    le Ven 11 Sep 2015 - 0:07

    Merciiii Very Happy
    avatar
    Dreamyland
    FémininAge : 21Messages : 88

    le Ven 11 Sep 2015 - 12:42

    Merciiii *^*
    avatar
    Rara
    FémininAge : 21Messages : 87

    le Ven 11 Sep 2015 - 23:38

    Merci!
    avatar
    Hawk Lowell
    FémininAge : 21Messages : 116

    le Mar 15 Sep 2015 - 14:29

    Merci
    avatar
    Sleyah
    FémininAge : 28Messages : 19

    le Ven 18 Sep 2015 - 19:55

    Trop merci !
    Contenu sponsorisé


      La date/heure actuelle est Ven 22 Juin 2018 - 7:06