Scribd Logo
Upload

Welcome to Scribd!

  • Untitled

    Uploaded by

    Ander 007
    12 views2 pages
    The document defines styles for a health bar with a progress element inside a container. It displays a health bar at 50% filled and provides additional character stats below including current health, armor class, and movement speed.

    Original Description:

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document defines styles for a health bar with a progress element inside a container. It displays a health bar at 50% filled and provides additional character stats below including current health, armor class, and movement speed.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    12 views2 pages

    Untitled

    Uploaded by

    Ander 007
    The document defines styles for a health bar with a progress element inside a container. It displays a health bar at 50% filled and provides additional character stats below including current health, armor class, and movement speed.

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 2

    <!

    DOCTYPE html>
    <html>
    <head>
    <title>Barra de Vida</title>
    <style>
    .barra {
    width: 500px;
    height: 20px;
    background-color: #f2f2f2;
    border-radius: 10px;
    margin-bottom: 20px;
    }

    .progresso {
    height: 100%;
    background-color: red;
    border-radius: 10px;
    transition: width 0.5s ease;
    }

    .valor {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    font-weight: bold;
    }
    </style>
    </head>
    <body>
    <div class="barra">
    <div class="progresso" style="width: 50%;"></div>
    </div>
    <div class="valor">
    <span>Vida: 50 / 100</span>
    <span>Classe de Armadura: 15</span>
    <span>Deslocamento: 30 pés</span>
    </div>
    </body>
    </html><!DOCTYPE html>
    <html>
    <head>
    <title>Barra de Vida</title>
    <style>
    .barra {
    width: 500px;
    height: 20px;
    background-color: #f2f2f2;
    border-radius: 10px;
    margin-bottom: 20px;
    }

    .progresso {
    height: 100%;
    background-color: red;
    border-radius: 10px;
    transition: width 0.5s ease;
    }

    .valor {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    font-weight: bold;
    }
    </style>
    </head>
    <body>
    <div class="barra">
    <div class="progresso" style="width: 50%;"></div>
    </div>
    <div class="valor">
    <span>Vida: 50 / 100</span>
    <span>Classe de Armadura: 15</span>
    <span>Deslocamento: 30 pés</span>
    </div>
    </body>
    </html>

    You might also like