Présentation #2

Aller en bas

Présentation #2

Message par Admin le Sam 23 Avr - 19:50

Nom du personnage

petite citation pour représenter ton personnage



Carte d'identité

Nom:
Sexe:
Âge:
Clan:
Rang:
Derrière l'écran

Votre prénom:
Votre PUF:
Votre âge:
Comment avez-vous connu le forum?
Quelles sont vos disponibilités?
Avez-vous des suggestions à nous faire?
Codes du règlement:

Physique

minimum x lignes


Mental

minimum x lignes


Histoire

minimum x lignes



Code:
<div class="presentation"><div class="nom_perso">Nom du personnage</div>
 <div class="quote_presentation">petite citation pour représenter ton personnage</div>
<div class="img_prez img1"></div>
 <table><tr><td><div class="cadre_perso chat"><div class="titre_presentation">Carte d'identité</div>
<div class="questions_cadre"><b>Nom:</b>
<b>Sexe:</b>
<b>Âge:</b>
<b>Clan:</b>
<b>Rang:</b></div></div></td>
 <td><div class="cadre_perso"><div class="titre_presentation">Derrière l'écran</div>
<div class="questions_cadre"><b>Votre prénom:</b>
<b>Votre PUF:</b>
<b>Votre âge:</b>
<b>Comment avez-vous connu le forum?</b>
<b>Quelles sont vos disponibilités?</b>
<b>Avez-vous des suggestions à nous faire?</b>
<b>Codes du règlement:</b></div></div></td></tr></table>
<div class="img_prez img2"></div>
<div class="partie_presentation"><div class="titre_presentation">Physique</div>
minimum x lignes</div>
<div class="img_prez img3"></div>
<div class="partie_presentation"><div class="titre_presentation">Mental</div>
minimum x lignes</div>
<div class="img_prez img4"></div>
<div class="partie_presentation"><div class="titre_presentation">Histoire</div>
minimum x lignes</div>
</div>

Code:
.presentation {
  margin:auto;
  width: 600px;
  background-color: #8fe966; /* couleur de fond de la fiche */
  color: #1e2a00; /* couleur du texte */
  font-family: serif; /* police de la presentation, je vous conseille de ne pas y toucher*/
  text-align:center;
  padding: 10px 0px;
}

.nom_perso {
  text-transform: uppercase;
  font-size: 25px;
  color: #303a15;
  letter-spacing: 0.3em;
  text-shadow: 0px 0px 1px #303a15;
  margin:auto;
}

.quote_presentation {
  margin-top: -35px;
  background-color: #e3f4db;
  text-transform: lowercase;
  font-size:10px;
}


.img_prez {
  width: 560px; /* largeur des images */
  height: 30px; /* hauteur des images */
  border: 1px solid #4E6020;
  box-sizing:border-box;
  margin:auto;
}

.img1 {
  background-image: url("http://zupimages.net/up/16/15/64l2.png"); /* url de la premiere image */
  margin-top: -10px;
}

.img2 {
  background-image: url("http://zupimages.net/up/16/15/p4dm.png"); /* url de la deuxieme image */
  margin-top:10px;
}

.img3 {
  background-image: url("http://zupimages.net/up/16/15/stm8.png"); /* url de la troisieme image */
  margin-top:-10px;
}

.img4 {
  background-image: url("http://zupimages.net/up/16/15/mbgp.png"); /* url de la quatrieme image */
  margin-top:-10px;
}

.presentation table {
  margin:auto;
  margin-top: -40px;
}

.cadre_perso { /* Pour les deux cadres: ceux sur le chat et celui du membre*/
  display:inline-block;
  width:200px;
  background-color: #e3f4db; /* couleur de fond */
  padding:5px 10px;
  border-left: 15px solid #8fe966; /* même couleur que celle de fon, c'est pour séparer les deux cadres */
  border-right: 15px solid #8fe966; /* idem */
}

.titre_presentation { /* Codage pour les différents petits titres */
  text-transform: uppercase;
  font-size: 13px;
  color: #303a15; /* couleur du text */
  text-shadow: 0px 0px 1px #303a15; /* ombre du texte */
  border-bottom: 1px solid #303a15; /* ligne en dessous des titres, le bord */
}

.questions_cadre { /* Codage pour le contenu des codes, permet d'avoir une scrollbar*/
  height: 140px;
  overflow:auto;
  margin-top: -5px;
  text-align:justify;
}

.partie_presentation { /* correpond aux cadres Histoire, Mental et Physique */
  width:500px;
  background-color: #e3f4db; /* couleur de fond */
  padding:5px 15px;
  margin:auto;
  text-align:justify;
  margin-top: -5px;
}

.partie_presentation .titre_presentation {
  font-size: 16px;
  text-align:center;
}

.questions_cadre::-webkit-scrollbar {
  width: 5px; /* largeur de la scrollbar */
}

.questions_cadre::-webkit-scrollbar-track-piece {
  background-color: #e3f4db; /* couleur de fond de la scrollbar */
}

.questions_cadre::-webkit-scrollbar-thumb {
  background-color: #1e2a00; /* couleur du bouton de la scrollbar */
}

Admin
Admin

Messages : 126
Date d'inscription : 26/04/2015

Voir le profil de l'utilisateur http://moosethecockblock.1fr1.net

Revenir en haut Aller en bas

Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum