Andrea
Dim 10 Déc 2023 - 16:38
◄ CREDITS ►
Codage de Andrea
Gifs de Wavvyboy par Koalavolant
Avatar de Wavvyboy par Andrea
Icons divers par Andrea
Codage de Andrea
Gifs de Wavvyboy par Koalavolant
Avatar de Wavvyboy par Andrea
Icons divers par Andrea
Le code Linéaire est accordé avec :
Sa fiche générale
Sa fiche de recap' rp
Sa fiche de lien (avec descriptions liens)
Sa fiche de bottin
Sa fiche de scénario
Sa fiche de pré-lien
Sa fiche de réponse rp
Prénom Prénom² Nom
Info générales
Nom - ...
Prénoms - ...
Date et lieu de naissance - ...
Orientation sexuelle - ...
Situation matrimoniale - ...
Groupe - ...
Célebrité - ...
Prénoms - ...
Date et lieu de naissance - ...
Orientation sexuelle - ...
Situation matrimoniale - ...
Groupe - ...
Célebrité - ...
Anecdotes
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.
Histoire
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.
Information membre
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.
Crédits Gifs (Koalavolant)
Andrea
Andrea
HTML:
- Code:
<center><div class="rplineaire"><div class="tittlelienaire">Prénom Prénom² Nom</div><div class="imagelineaire"><img src="https://i.imgur.com/IgAdGZ6.gif" alt=""><img src="https://i.imgur.com/iDuCgnI.gif" alt=""></div><div class="titrepreslineaire">Info générales</div><div class="infolineaire"><div class="textpreslineaire">Nom - ...
Prénoms - ...
Date et lieu de naissance - ...
Orientation sexuelle - ...
Situation matrimoniale - ...
Groupe - ...
Célebrité - ...</div><div class="avatarlineaire"><img src="https://images2.imgbox.com/dc/fd/N5zLl9lj_o.png" alt=""></div></div><div class="titrepreslineaire">Anecdotes</div><div class="anlineaire"><div class="imagepreslineaire"><img src="https://i.imgur.com/nUIssrh.png" alt=""></div><div class="textanpreslineaire">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.</div></div><div class="titrepreslineaire">Histoire</div><div class="storypreslineaire">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.</div><div class="titrepreslineaire">Information membre</div><div class="memlineaire"><div class="textanpreslineaire">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.</div><div class="imagepresmemlineaire"><img src="https://i.imgur.com/PR90lED.png" alt=""></div></div><div class="creditlineaire">Crédits Gifs (Koalavolant)
<a href="https://pisrale.forumactif.com/">Andrea</a></div></div></center>
CSS:
- Code:
.rplineaire{
width: 500px;
border-left: 10px solid #1e6baf;
margin: 10px;
}
.tittlelienaire{
width: 400px;
margin: 10px 20px 10px 20px;
padding-top: 15px;
font-size: 20px;
text-transform: uppercase;
text-align: right;
}
.imagelineaire{
display: grid;
grid-template-columns: 1fr 1fr;
background-color: #1e6baf;
}
.imagelineaire img{
width: 230px;
height: 150px;
object-fit: cover;
padding: 10px;
}
.infolineaire{
display: grid;
grid-template-columns: 2fr 1fr;
}
.anlineaire{
display: grid;
grid-template-columns: 1fr 2fr;
}
.memlineaire{
display: grid;
grid-template-columns: 2fr 1fr;
}
.textanpreslineaire{
height: 160px;
margin: 10px;
overflow: auto;
font-size: 14px;
text-align: justify;
}
.imagepreslineaire{
background-color: #1e6baf;
padding: 15px 20px 10px 10px;
width: 180px;
}
.imagepreslineaire img{
width: 150px;
height: 150px;
object-fit: cover;
}
.imagepresmemlineaire{
background-color: #1e6baf;
padding: 15px 20px 10px 20px;
width: 180px;
}
.imagepresmemlineaire img{
width: 150px;
height: 150px;
object-fit: cover;
}
.avatarlineaire{
background-color: #1e6baf;
padding: 10px 20px ;
width: 240px;
}
.avatarlineaire img{
width: 200px;
height: 320px;
object-fit: cover;
}
.titrepreslineaire{
border-top: 5px solid #1e6baf;
border-bottom: 5px solid #1e6baf;
font-weight: bold;
font-style: italic;
text-align: center;
font-size: 14px;
padding: 5px;
}
.textpreslineaire{
text-align: justify;
height: 320px;
margin: 10px;
overflow: auto;
font-size: 14px;
}
.storypreslineaire{
text-align: justify;
margin: 10px;
font-size: 14px;
}
.textpreslineaire a{
text-decoration: none;
}
.creditpreslineaire{
text-align: center;
text-transform: uppercase;
border-top: 5px solid #1e6baf;
font-size: 10px;
line-height: 20px;
}
.creditpreslineaire a{
text-decoration: none;
}
Si vous voulez pas mettre le CSS dans celui du Forum, voici le code juste copier/coller:
- Code:
<center><div class="rplineaire"><div class="tittlelienaire">Prénom Prénom² Nom</div><div class="imagelineaire"><img src="https://i.imgur.com/IgAdGZ6.gif" alt=""><img src="https://i.imgur.com/iDuCgnI.gif" alt=""></div><div class="titrepreslineaire">Info générales</div><div class="infolineaire"><div class="textpreslineaire">Nom - ...
Prénoms - ...
Date et lieu de naissance - ...
Orientation sexuelle - ...
Situation matrimoniale - ...
Groupe - ...
Célebrité - ...</div><div class="avatarlineaire"><img src="https://images2.imgbox.com/dc/fd/N5zLl9lj_o.png" alt=""></div></div><div class="titrepreslineaire">Anecdotes</div><div class="anlineaire"><div class="imagepreslineaire"><img src="https://i.imgur.com/nUIssrh.png" alt=""></div><div class="textanpreslineaire">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.</div></div><div class="titrepreslineaire">Histoire</div><div class="storypreslineaire">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.</div><div class="titrepreslineaire">Information membre</div><div class="memlineaire"><div class="textanpreslineaire">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Etiam tempor orci eu lobortis elementum nibh tellus. Ultrices sagittis orci a scelerisque. Faucibus et molestie ac feugiat. Etiam non quam lacus suspendisse faucibus interdum posuere. Pellentesque adipiscing commodo elit at imperdiet dui. Sit amet consectetur adipiscing elit pellentesque. Volutpat lacus laoreet non curabitur gravida. Et odio pellentesque diam volutpat commodo. Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam. Ut ornare lectus sit amet est placerat. Iaculis eu non diam phasellus vestibulum. Leo vel fringilla est ullamcorper. Blandit aliquam etiam erat velit scelerisque in. Fermentum et sollicitudin ac orci phasellus egestas tellus rutrum tellus.</div><div class="imagepresmemlineaire"><img src="https://i.imgur.com/PR90lED.png" alt=""></div></div><div class="creditpreslineaire"><a href="https://pisrale.forumactif.com/">Andrea</a></div></div></center>
<style>.rplineaire{width: 500px;border-left: 10px solid #1e6baf;margin: 10px;}.tittlelienaire{width: 400px;margin: 10px 20px 10px 20px;padding-top: 15px;font-size: 20px;text-transform: uppercase;text-align: right;}.imagelineaire{display: grid;grid-template-columns: 1fr 1fr;background-color: #1e6baf;}.imagelineaire img{width: 230px;height: 150px;object-fit: cover;padding: 10px;}.infolineaire{display: grid;grid-template-columns: 2fr 1fr;}.anlineaire{display: grid;grid-template-columns: 1fr 2fr;}.memlineaire{display: grid;grid-template-columns: 2fr 1fr;}.textanpreslineaire{height: 160px;margin: 10px;overflow: auto;font-size: 14px;text-align: justify;}.imagepreslineaire{background-color: #1e6baf;padding: 15px 20px 10px 10px;width: 180px;}.imagepreslineaire img{width: 150px;height: 150px;object-fit: cover;}.imagepresmemlineaire{background-color: #1e6baf;padding: 15px 20px 10px 20px;width: 180px;}.imagepresmemlineaire img{width: 150px;height: 150px;object-fit: cover;}.avatarlineaire{background-color: #1e6baf;padding: 10px 20px ;width: 240px;}.avatarlineaire img{width: 200px;height: 320px;object-fit: cover;}.titrepreslineaire{border-top: 5px solid #1e6baf;border-bottom: 5px solid #1e6baf;font-weight: bold;font-style: italic;text-align: center;font-size: 14px;padding: 5px;}.textpreslineaire{text-align: justify;height: 320px;margin: 10px;overflow: auto;font-size: 14px;}.storypreslineaire{text-align: justify;margin: 10px;font-size: 14px;}.textpreslineaire a{text-decoration: none;}.creditpreslineaire{text-align: center;text-transform: uppercase;border-top: 5px solid #1e6baf;font-size: 10px;line-height: 20px;}.creditpreslineaire a{text-decoration: none;}</style>
Les couleurs / images / contenus sont bien évidement modifiables! N'oubliez pas de laisser le crédit
|
|
|
