Un forum de discussions pour parler de tout et de rien, de vos études, de vos vacances, de vos loisirs et faire plein de connaissances !
 

Partagez | 
 

 Fiche pour son océan III

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Sygea
Lion des mers
Lion des mers
avatar
Messages : 537
Date d'inscription : 18/04/2016

Message Sujet: Fiche pour son océan III   Dim 31 Juil - 16:55

Yop, une nouvelle fiche sur une idée de Shaden, comme je sais pas où l'utiliser, la voici !

• Un petit merci ça fait toujours plaisir !
• L'image est en 200*200px obligatoirement
• Il faut un forum test pour l'utiliser, si vous avez besoin d'aide dites-moi je vous aiderai à créer la page
• Ne pas retirer/modifier le copyright !



Code:
<!DOCTYPE html>
    <html lang="fr">
      <link href="https://fonts.googleapis.com/css?family=Marck+Script" rel="stylesheet" type="text/css">
    <head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Language" content="fr" />
                    <meta name="author" content="Nom de l'auteur" />
                    <meta name="description" content"Description de la page en quelques phrases" />
    <title>Titre de votre page</title>
    <style type="text/css">
      .fondg{
      height: 920px;
      width: 600px;
      background:url('http://image.noelshack.com/fichiers/2016/30/1469960528-oceanshaden.png');
      }
     
      .gtitre{
      width:600px;
      height:150px;
      font-size: 34px;
      font-family:Marck Script;
      text-align: center;
      padding-top: 60px;
      transform:rotate(-3deg);
      text-shadow:1px 1px 0px #67714a;
      letter-spacing: 6px;
      color: white;
      }
     
      .avatar{
      height: 200px;
      width: 200px;
      background:url(http://image.noelshack.com/fichiers/2016/30/1469966698-ertuiklmliuytr.png);
      margin-left:50px;
      margin-top:-55px;
      transform:rotate(-10deg);
      border-radius: 100px;
      -webkit-transition-duration:1000ms;
      -moz-transition-duration:1000ms;
      -o-transition-duration:1000ms;
      -transition-duration:1000ms;
      box-shadow: 0px 0px 5px grey;
      }
     
      .avatar:hover{
      -webkit-transform:rotate(360deg);
      -moz-transform:rotate(360deg);
      -o-transform:rotate(360deg);
      -ms-transform:rotate(360deg);
      -webkit-transition-duration:1000ms;
      -moz-transition-duration:1000ms;
      -o-transition-duration:1000ms;
      -transition-duration:1000ms;
      }
     
      .presentation{
      width: 275px;
      height: 195px;
      color: white;
      font-size: 14px;
      font-family: Courier new;
      text-align: center;
      margin-left: -5px;
      margin-top: -25px;
      overflow: hidden;
      line-height: 30px;
      letter-spacing: 2px;
      text-shadow: 1px 1px 0px #5e4444;
      }
     
      .faq{
      width:490px;
      max-height: 80px;
      color: white;
      font-size: 11px;
      font-family: courier new;
      text-align: justify;
      margin-left: 60px;
      margin-top: 10px;
      overflow: auto;
      padding: 5px;
      text-shadow: 1px 1px 0px #a17878;
      }

      .titrepave{
      font-family:marck Script;
      font-size: 20px;
      color: white;
      text-shadow:1px 1px 0px #67714a;
      text-align: center;
      margin-top: 40px;
      letter-spacing: 2px;
      margin-left: 50px;
      }
     
      .pave{
      color: white;
      font-family: courier new;
      font-size: 12px;
      letter-spacing: 2px;
      text-align: justify;
      height: 190px;
      width: 380px;
      overflow: auto;
      margin-left: 125px;
      padding: 5px;
      margin-top: 15px;
      text-shadow: 1px 1px 0px #956161;
      }
     
      .copyright{
      z-index: 1;
      color: white;
      font-family: marck script;
      font-size: 12px;
      text-shadow:1px 1px 0px #67714a;
      text-align: right;
      transform: rotate(-3deg);
      margin-right: 100px;
      margin-top: -20px;
      }
     
      .citation{
      z-index: 2;
      width: 500px;
      height: 40px;
      color: #594747;
      font-size: 12px;
      font-family: marck script;
      text-align: center;
      margin-top: 40px;
      margin-left: 60px;
      line-height: -15px;
      overflow: hidden;
      }
     
      .lignemaj{
      height: 20px;
      width: 150px;
      margin-left: 100px;
      margin-top: 10px;
      }
     
      .maj{
      display:inline-block;
      position: relative;
      z-index:3;
      margin-left: -5px;
      -webkit-transition-duration:1000ms;
      -moz-transition-duration:1000ms;
      -o-transition-duration:1000ms;
      -transition-duration:1000ms;
  }
     
      .maj:hover{
      -webkit-transform:rotate(90deg);
      -moz-transform:rotate(90deg);
      -o-transform:rotate(90deg);
      -ms-transform:rotate(90deg);
      -webkit-transition-duration:1000ms;
      -moz-transition-duration:1000ms;
      -o-transition-duration:1000ms;
      -transition-duration:1000ms;
      }

                    </style>
                  <body>
                    <div class="fondg">
                      <div class="gtitre">Océan de Pseudo</div>
                      <table><tr>
                        <td><div class="avatar"></div></td>
                        <td><div class="presentation">
                          Prénom: Réponse ici <br/>
                          Origines: Réponse ici <br/>
                          Hobbies: Réponse ici<br/>
                          Signe astro: Réponse ici<br/>
                          Signe Chinois: Réponse ici <br/>
                          Etudes: Réponse ici<br/></div></td>
                        </tr></table>
                     
                      <div class="faq"><span style="font-family:Marck Script;font-size:14px;">Question éventuelle:</span> Réponse ici Réponse ici Réponse ici Réponse ici<br/>
                        <span style="font-family:Marck Script;font-size:14px;">Question éventuelle:</span> Réponse ici Réponse ici Réponse ici Réponse ici <br/>
                        <span style="font-family:Marck Script;font-size:14px;">Question éventuelle:</span> Réponse ici Réponse ici Réponse ici Réponse ici <br/>
                        <span style="font-family:Marck Script;font-size:14px;">Question éventuelle:</span> Réponse ici Réponse ici Réponse ici Réponse ici <br/>
                      </div>
                     
                      <div class="titrepave">Titre de mon premier pavé ici</div>
                      <div class="pave">Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis
                        confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut
                        appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini
                        praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque
                        discrimen vitae vexatus nihil fateri conpulsus est.
                      Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis
                        confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut
                        appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini
                        praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque
                        discrimen vitae vexatus nihil fateri conpulsus est.
                      Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis
                        confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut
                        appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini
                        praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque
                        discrimen vitae vexatus nihil fateri conpulsus est.
                      Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis
                        confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut
                        appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini
                        praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque
                        discrimen vitae vexatus nihil fateri conpulsus est.
                      Post haec indumentum regale quaerebatur et ministris fucandae purpurae tortis
                        confessisque pectoralem tuniculam sine manicis textam, Maras nomine quidam inductus est ut
                        appellant Christiani diaconus, cuius prolatae litterae scriptae Graeco sermone ad Tyrii textrini
                        praepositum celerari speciem perurgebant quam autem non indicabant denique etiam idem ad usque
                        discrimen vitae vexatus nihil fateri conpulsus est.</div>
                     
                      <div class="citation">Une belle p'tite citation par ici parce que là haut yapu dplace
                        </div>
                        <div class="lignemaj">
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                      <div class="maj"><a href="LIEN_URL_MAJ" target="_blank"><img src="http://image.noelshack.com/fichiers/2016/30/1469970718-sdfghjkl.png"/style="width:20px;"/></a></div>
                        </div>
                                              <div class="copyright">©️ Fiche Par Sygea / Maquette par Shaden</div>
                   
                  </body>
    </html>

L'iframe à remplir:
Code:
<center><iframe name="" src="URL DE LA PAGE HTML ICI" scrolling="no" height="930" width="650" FRAMEBORDER="no"></iframe></center>

Voilà ! :pandablush:


« John Milton : Les épaules d'une femme sont la ligne de démarcation de sa mystique, et son cou, si elle est vibrante, recèle tous les mystères d'une ville frontière. Un no man's land dans le combat entre l'esprit et le corps. »
- John Milton, L'associé du diable
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Léa
Baleine de Nemo
Baleine de Nemo
avatar
Messages : 2159
Date d'inscription : 14/07/2015
Age : 22

Message Sujet: Re: Fiche pour son océan III   Dim 31 Juil - 17:17

OUAAAAAAAAAAH ! Cette fiche est tout simplement splendide ! MERCI ENORMEMENT !!!! :pingoun: :pingoun: :pingoun: :pingoun:


Kill Me, Heal Me




Bouh:
 
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Louve Ailée
Léviathan des Nymphes
Léviathan des Nymphes
avatar
Messages : 3118
Date d'inscription : 14/07/2015
Age : 21

Message Sujet: Re: Fiche pour son océan III   Mar 2 Aoû - 14:33

Waaaah j'adooooore c'est trop beauuuu ! :32onion:


Présence réduite du 23/08 et toute l'année scolaire
Mes récompenses:
 
Comment taguer mon pseudo ?:
 
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Sygea
Lion des mers
Lion des mers
avatar
Messages : 537
Date d'inscription : 18/04/2016

Message Sujet: Re: Fiche pour son océan III   Mar 2 Aoû - 14:55

J'ai juste codé l'idée de Shaden, j'ai pas vraiment de mérite :pandadead: N'hésitez pas à la prendre ~~


« John Milton : Les épaules d'une femme sont la ligne de démarcation de sa mystique, et son cou, si elle est vibrante, recèle tous les mystères d'une ville frontière. Un no man's land dans le combat entre l'esprit et le corps. »
- John Milton, L'associé du diable
Revenir en haut Aller en bas
Voir le profil de l'utilisateur
M&Tass
Lion des mers
Lion des mers
avatar
Messages : 861
Date d'inscription : 05/06/2016
Age : 27

Message Sujet: Re: Fiche pour son océan III   Mar 2 Aoû - 15:07

Très belle fiche ! :) J'adore comment c'est fait, les couleurs et tout !




Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Neyka
Baleine de Nemo
Baleine de Nemo
avatar
Messages : 1197
Date d'inscription : 17/08/2016
Age : 15

Message Sujet: Re: Fiche pour son océan III   Ven 16 Juin - 23:21

Je t'emprunte cette magnifique fiche :heart:


Anciennement Milkamiam

Revenir en haut Aller en bas
Voir le profil de l'utilisateur
Contenu sponsorisé



Message Sujet: Re: Fiche pour son océan III   

Revenir en haut Aller en bas
 
Fiche pour son océan III
Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» Fiche pour Fabriquer un Petit Panier à Garnir en toute Occasion
» Fiche pour son océan II
» Voilà un gars dont ses descendants vont rigoler pour faire sa fiche généalogique
» Ahnenblatt - gratuit pour débuter
» fiche d`assiduité versus bordereau de rétribution.

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Ocean Home :: Our Homes :: Vos talents artistiques :: Codage :: Libre Service-