Transformation HTML vers CSS
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1 • Partagez
Transformation HTML vers CSS
Bonjour. J'ai actuellement cette fiche de présentation pour mon forum. Cependant, pour des raisons de facilitée et d'esthetique, j'aimerais la transformer en css. Ainsi les membres ne peuvent la prendre pour leur forum et j'aurais plus de faciliter de changer toutes les couleurs, que de devoir modifier les fiches a chaques themes. J'ai deja modifier la fiche pour qu'elle colle avec mon design :
- Code:
<center><div style="border-radius:20px; border-left: 5px solid #AF8865; border-right: 5px solid #AF8865; background-image:url('http://obsession27.free.fr/divers/fonds/pfo.gif'); width:650px;text-align:center; align:center;">
[img]http://nsa29.casimages.com/img/2012/06/11/120611014329658924.png[/img]<div style="font-size:40px; letter-spacing:5px; font-family:Georgia;padding:5px; text-transform:uppercase; font-weight:lighter;text-align:center;">Prénom</div>
[center][size=12]Age - Meute - Rang - Pouvoir.[/size][/center]<br>
[left]<span style="font-family:Georgia;font-size:25px;color: beige; text-align:left; border-bottom: 3px dotted #AF8865;margin-left:15px;">[b]I-[/b] Personality & Tastes</span>[/left]
<br><center>
<blockquote style="width: 450px;background-color:#AF8865;padding:10px;">
[center][color=beige][b]JE SUIS CE QUE JE SUIS ...[/b][/color]<br> [justify][i]Minimum 5 Lignes[/i]. ECRIRE ICI[/justify]
<br> [/center]</blockquote><blockquote style="width: 450px;background-color:#AF8865;padding:10px;">
[center][color=beige][justify][b]Ҩ[/b] Chose qu'il/elle aime [b]Ҩ[/b] Chose qu'il/elle aime pas [b]Ҩ[/b] Chose qu'il/elle aime [b]Ҩ[/b] Chose qu'il/elle aime pas [b]Ҩ[/b] Chose qu'il/elle aime pas [b]Ҩ[/b] Chose qu'il/elle aime [b]Ҩ[/b] Chose qu'il/elle aime pas [b]Ҩ[/b] Chose qu'il/elle aime [b]Ҩ[/b] Chose qu'il/elle aime pas [b]Ҩ[/b] Chose qu'il/elle aime [b]Ҩ[/b] Chose qu'il/elle aime pas [b]Ҩ[/b] Chose qu'...[/justify] <br>[/color] [/center]</blockquote></center>
[left]<span style="font-family:Georgia;font-size:25px;color: beige; text-align:left; border-bottom: 3px dotted #AF8865;margin-left:15px;">[b]II-[/b] Once upon a time ...</span>[/left]
<br><center>
<blockquote style="width: 450px;background-color:#AF8865;padding:10px;">
[center][color=beige][b]VOICI MON HISTOIRE ...[/b][/color]<br>[justify][i]Minimum 10 Lignes[/i]. ECRIRE ICI[/justify]
<br>[/center] </blockquote></center>
[left]<span style="font-family:Georgia;font-size:25px;color: beige; text-align:left; border-bottom: 3px dotted #AF8865;margin-left:15px;">[b]IV-[/b] Who am I ?</span>[/left]
<br><center>
<blockquote style="width: 450px;background-color:#AF8865;padding:10px;">
[center][justify][color=beige][b]Prénom/Pseudo:[/b][/color] ECRIRE ICI<br>[color=beige][b]Age:[/b][/color] ECRIRE ICI
[color=beige][b]Sexe:[/b][/color] ECRIRE ICI<br>[color=beige][b]Où as-tu trouver le forum ?:[/b][/color] ECRIRE ICI
[color=beige][b]Si tu devais ajouter quelque chose au forum ?:[/b][/color] ECRIRE ICI
[color=beige][b]Code:[/b][/color] ECRIRE ICI
[/justify] [/center]</blockquote></center>
<span style="font-size: 8px; line-height: normal">Fiche codée par Umi.</span>
</div></center>
Dernière édition par Mitsoky le Ven 14 Sep 2012 - 17:48, édité 1 fois
Re: Transformation HTML vers CSS
Bonjour,
Avant de me lancer dans la conversion de votre code, j'aimerais savoir deux, trois choses :
- Voulez-vous des titres CSS spécifique ? (si oui, lesquelles ?)
- Voulez-vous que je rajoute certaines valeurs à votre CSS pour que par exemple les coins arrondis sont visibles par le maximum de navigateurs ?
- Vous avez mis dans votre code des balises telles que par exemple : "[justify]", voulez-vous que je mette cela dans votre CSS ? (remplacé par "text-align: justify", cepandant pas modifiable par les membres ?)
Cordialement, Naruhiko !
Avant de me lancer dans la conversion de votre code, j'aimerais savoir deux, trois choses :
- Voulez-vous des titres CSS spécifique ? (si oui, lesquelles ?)
- Voulez-vous que je rajoute certaines valeurs à votre CSS pour que par exemple les coins arrondis sont visibles par le maximum de navigateurs ?
- Vous avez mis dans votre code des balises telles que par exemple : "[justify]", voulez-vous que je mette cela dans votre CSS ? (remplacé par "text-align: justify", cepandant pas modifiable par les membres ?)
Cordialement, Naruhiko !
Re: Transformation HTML vers CSS
Tout d'abord, merci de vous proposer.
Je n'ai pas de titres spéciales, mêmes des mots etranges me conviennent xD.
J'aimerais bien car c'est vraiment désagreable de savoir que des gens ne voient pas la meme chose que vous, juste parce qu'ils ont IE.
Et si tu veux.
Merci beaucoup.
Je n'ai pas de titres spéciales, mêmes des mots etranges me conviennent xD.
J'aimerais bien car c'est vraiment désagreable de savoir que des gens ne voient pas la meme chose que vous, juste parce qu'ils ont IE.
Et si tu veux.
Merci beaucoup.
Re: Transformation HTML vers CSS
Voilà, j'ai essayé de corriger le plus d'erreur possible, rien de bien grave ^^. Donc voici le code HTML :
Voici un shema vite fait des titres de CSS utilisé :
Suffit de petites connaissances en CSS pour changer le titre, il faudra changer également le titre dans le contenu HTML.
PS : Pour les retour à la ligne en HTML, <br> fonctionne, mais la balise est incorrecte car elle n'est pas fermée, il faut donc mettre <br /> !
Cordialement Naruhiko.
- Code:
<center><div class="imagefond">
[img]http://nsa29.casimages.com/img/2012/06/11/120611014329658924.png[/img]<div class="prenom">Prénom</div> [center][size=12]Age - Meute - Rang - Pouvoir.[/size][/center]<br /> [left]<span class="titre">[b]I-[/b] Personality & Tastes</span>[/left]
<br /><center>
<blockquote class="backgroundcontenu"> [center][color=beige][b]JE SUIS CE QUE JE SUIS ...[/b][/color]<br />[justify][i]Minimum 5 Lignes[/i]. ECRIRE ICI[/justify]
<br />[/center]</blockquote><blockquote class="backgroundcontenu"> [center][color=beige][justify][b]?[/b] Chose qu'il/elle aime [b]?[/b] Chose qu'il/elle aime pas [b]?[/b] Chose qu'il/elle aime [b]?[/b] Chose qu'il/elle aime pas [b]?[/b] Chose qu'il/elle aime pas [b]?[/b] Chose qu'il/elle aime [b]?[/b] Chose qu'il/elle aime pas [b]?[/b] Chose qu'il/elle aime [b]?[/b] Chose qu'il/elle aime pas [b]?[/b] Chose qu'il/elle aime [b]?[/b] Chose qu'il/elle aime pas [b]?[/b] Chose qu'...[/justify][/color][/center]<br /></blockquote></center>
[left]<span class="titre">[b]II-[/b] Once upon a time ...</span>[/left]
<br /><center>
<blockquote class="backgroundcontenu">
[center][color=beige][b]VOICI MON HISTOIRE ...[/b][/color]<br />[justify][i]Minimum 10 Lignes[/i]. ECRIRE ICI[/justify][/center]<br /></blockquote></center>
[left]<span class="titre">[b]IV-[/b] Who am I ?</span>[/left]
<br /><center>
<blockquote class="backgroundcontenu">
[center][justify][color=beige][b]Prénom/Pseudo:[/b][/color] ECRIRE ICI<br />[color=beige][b]Age:[/b][/color] ECRIRE ICI
[color=beige][b]Sexe:[/b][/color] ECRIRE ICI<br />[color=beige][b]Où as-tu trouver le forum ?:[/b][/color] ECRIRE ICI
[color=beige][b]Si tu devais ajouter quelque chose au forum ?:[/b][/color] ECRIRE ICI
[color=beige][b]Code:[/b][/color] ECRIRE ICI
[/justify][/center]</blockquote></center>
<span class="credit">Fiche codée par Umi.</span>
</div></center>
- Code:
/* Début du CSS pour la fiche de présentation */
.imagefond{
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-khtml-border-radius: 20px;
-o-border-radius: 20px;
border-left: 5px solid #AF8865;
border-right: 5px solid #AF8865;
background-image: url('http://obsession27.free.fr/divers/fonds/pfo.gif');
width: 650px;
text-align: center;
}
.titre{
font-family: Georgia;
font-size: 25px;
color: beige;
text-align: left;
border-bottom: 3px dotted #AF8865;
margin-left: 15px;
}
.prenom{
font-size: 40px;
letter-spacing: 5px;
font-family: Georgia;
padding: 5px;
text-transform: uppercase;
font-weight: lighter;
text-align: center;
}
.backgroundcontenu{
width: 450px;
background-color: #AF8865;
padding: 10px;
}
.credit{
font-size: 8px;
line-height: normal;
}
/* Fin du CSS pour la fiche de présentation */
Voici un shema vite fait des titres de CSS utilisé :
Suffit de petites connaissances en CSS pour changer le titre, il faudra changer également le titre dans le contenu HTML.
PS : Pour les retour à la ligne en HTML, <br> fonctionne, mais la balise est incorrecte car elle n'est pas fermée, il faut donc mettre <br /> !
Cordialement Naruhiko.
Re: Transformation HTML vers CSS
Merci enormement, c'est exactement ce que je voulais *-*
Et les renseignements en plus.
Merciii !
Et les renseignements en plus.
Merciii !
Sujets similaires
» code html pour redirection vers un site associé
» Problème page html vers acceuil
» HTML - énorme Décalage tableau vers le bas
» Redirection vers une page HTML au lieu de "Répondre" ou "Nouveau"
» redirection vers page html fonctionne pas sur smartphone
» Problème page html vers acceuil
» HTML - énorme Décalage tableau vers le bas
» Redirection vers une page HTML au lieu de "Répondre" ou "Nouveau"
» redirection vers page html fonctionne pas sur smartphone
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Problème avec un script, un code :: Archives des problèmes avec un code
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum