up?

Est-ce que tu peux préciser davantage? par exemple compte tu changer la couleur de la barre après un certain cap? Par exemple dans Legend of Dragoon, si ton personnage avait moins que 50% de son max PV, son curseur devenait jaune puis rouge à 25%.

Sinon voila :)

Code:

<div class="greybox"><div class="typename">HP:75/100</div><div class="emptybar"><div style="border-radius:10px;width:75%; height:25px; background-color:red;"></div></div><br><div class="typename">MP:5/10</div><div class="emptybar"><div style="border-radius:10px;width:50%; height:25px; background-color:blue;"></div></div></div><br><div class="bigframe">Ton contenu ici s'il-te-plait




</div></div>


Et le css qui va avec.

Code:

.greybox {border:2px #000000 solid;
margin:auto;
width:600px;
height:120px;
padding:12px;
background-color:grey;}

.emptybar{border-radius:10px;
margin:auto;
width:200px;
height:25px;
background-color:#ffffff;}

.typename{border-radius:10px;
margin:auto;
width:300px;
height:25px;
font-size: 24px;
color: #000000;}

.bigframe{border-radius:10px;
margin:auto;
width:500px;
height:400px;
background-color:#ffffff;}

Pour les valeurs en % t'as juste à entré le nombre de PV actuel, divise par le maximum possible et tu multiplie par 100

Par exemple: 64PV sur 123
64/123 = 52%

Merci d'avoir répondu Luirio.

Pour ce qui est des couleurs je pensais à du vert quand la barre est pleine, orange quand elle arrive à la moitié, rouge si c'est dès qui reste que peu de point de vie.
Là pour l'instant la barre de vie est de 25 points.
Mais il sera possible de l'augmenter plus tard?
Et était il possible de mettre des nom sur le côté de la barre?

25 ->19#29A947
18->7 #fe7803
6->0#b9121b

Up?

Up?

Up?

Up?

Up?

Coucou, je peux peut-être déjà répondre pour une de tes questions:

Mais il sera possible de l'augmenter plus tard?

Je pense que oui, il suffit que tu change cette partie sur ton code HTML :

Code:

HP:75/100

et

Code:

width:75%;

par exemple du met 100% et pour la couleur :

Code:

background-color:red;

par exemple. tu pourras changer avec

Code:

background-color:#29A947;

Et était il possible de mettre des nom sur le côté de la barre?

Oui c'est surement possible également. Je pense qu'on peux le faire en créent une nouvelle div.

Essaye avec ce petit rajout dans tes codes, est dit moi si c'est bien ça que tu voulais?

Le HTLM:

Code:

<div class="greybox"><div class="typename">HP:75/100</div><div class="pseudo"> NOM PSEUDO </div><div class="emptybar"><div style="border-radius:10px;width:75%; height:25px; background-color:red;"></div></div><br><div class="typename">MP:5/10</div><div class="pseudo"> NOM PSEUDO </div><div class="emptybar"><div style="border-radius:10px;width:50%; height:25px; background-color:blue;"></div></div></div><br><div class="bigframe">Ton contenu ici s'il-te-plait
</div></div>

Le CSS:

Code:

 .greybox {border:2px #000000 solid;
    margin:auto;
    width:600px;
    height:120px;
    padding:12px;
    background-color:grey;}

    .emptybar{border-radius:10px;
    margin:auto;
    width:200px;
    height:25px;
    background-color:#ffffff;}

    .pseudo{float: left;
  color: black;
  font-size: 13px;}

    .typename{border-radius:10px;
    margin:auto;
    width:300px;
    height:25px;
    font-size: 24px;
    color: #000000;}

    .bigframe{border-radius:10px;
    margin:auto;
    width:500px;
    height:400px;
    background-color:#ffffff;}

Après bien sur tu peux changer la taille du texte, la couleur, la police etc...

Voilà j'espère t'avoir aider, sinon j'espère que tu aura tes réponses.

Coucou Ombinou

Est ce que tu as vu la réponse de Hancok ?