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 : 9757

    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
    PuppetBlue
    FémininAge : 26Messages : 111

    le Jeu 23 Juin 2016 - 19:51

    Merci beaucoup du partage



    avatar
    Lyana Taylor
    FémininAge : 22Messages : 71

    le Ven 24 Juin 2016 - 13:52

    Merci !



    avatar
    Chaos
    FémininAge : 25Messages : 4

    le Sam 25 Juin 2016 - 19:15

    merci
    avatar
    Whitemoon
    FémininAge : 18Messages : 695

    le Lun 27 Juin 2016 - 11:48

    Très joli !



    avatar
    Tsukkomi.
    FémininAge : 17Messages : 17

    le Sam 9 Juil 2016 - 14:29

    Merci !
    avatar
    Nyroc
    MasculinAge : 16Messages : 57

    le Dim 17 Juil 2016 - 20:07

    Merci ^^



    avatar
    liliebia
    FémininAge : 30Messages : 67

    le Mer 20 Juil 2016 - 10:52

    Merci ♥
    avatar
    Zomega
    FémininAge : 28Messages : 31

    le Jeu 21 Juil 2016 - 21:50

    thanks !
    avatar
    messia
    FémininAge : 21Messages : 18

    le Mar 26 Juil 2016 - 14:41

    Merci du partage !
    avatar
    naah
    MasculinAge : 24Messages : 79

    le Dim 4 Sep 2016 - 21:46

    Merci !
    avatar
    Encrine
    FémininAge : 20Messages : 52

    le Lun 12 Sep 2016 - 15:48

    Merciiiii !
    avatar
    Laya
    FémininAge : 19Messages : 19

    le Ven 16 Sep 2016 - 19:28

    j'adore ** merci Very Happy
    avatar
    MikuSong
    FémininAge : 21Messages : 32

    le Mar 27 Sep 2016 - 10:36

    Merci beaucoup pour le partage Wink




    N'est pas peur...Je suis un gentil fantôme /
    avatar
    Rowan
    FémininAge : 16Messages : 54

    le Mar 27 Sep 2016 - 23:51

    Cette PA ** Je te l'emprunte !
    avatar
    Steel Block
    MasculinAge : 23Messages : 34

    le Sam 1 Oct 2016 - 13:58

    Jolie
    avatar
    Aladiah
    FémininAge : 21Messages : 58

    le Mar 4 Oct 2016 - 14:10

    Merci :3
    avatar
    Nillium
    FémininAge : 19Messages : 16

    le Sam 29 Oct 2016 - 14:03

    Merci :3
    avatar
    Popcorn
    MasculinAge : 28Messages : 41

    le Dim 4 Déc 2016 - 23:57

    L'ensemble est vraiment réussie, j'adore ! Merci pour le partage !
    avatar
    -Larme-
    FémininAge : 18Messages : 62

    le Lun 2 Jan 2017 - 17:01

    Merci !



    avatar
    Sounik
    MasculinAge : 19Messages : 17

    le Dim 15 Jan 2017 - 17:16

    merci !
    avatar
    Dark Fairy
    FémininAge : 21Messages : 227

    le Mar 7 Fév 2017 - 11:01

    Merci beaucoup pour la partage! Mon forum ne se base pas sur les pirates (plutôt sur Fairy Tail) mais les couleurs sont parfaites par rapport à mon contexte puisqu'il s'agit d'îles perdues en pleine mer
    avatar
    Noho
    FémininAge : 22Messages : 26

    le Lun 13 Fév 2017 - 14:43

    Jolie page d'accueil, merci beaucoup !
    avatar
    Off
    FémininAge : 17Messages : 8

    le Lun 13 Fév 2017 - 18:05

    Super code, merci ! ♪
    avatar
    SweetieBay
    FémininAge : 26Messages : 143

    le Mer 15 Fév 2017 - 1:33

    simple et jolie, merci !
    avatar
    Amarante
    FémininAge : 21Messages : 39

    le Mer 15 Fév 2017 - 15:33

    merci :love:
    Contenu sponsorisé


      La date/heure actuelle est Mar 18 Déc 2018 - 18:43