GameZer Online


Você não está conectado. Conecte-se ou registre-se

Ver o tópico anterior Ver o tópico seguinte Ir em baixo  Mensagem [Página 1 de 1]

1 Barra de porcentagem em Ter Jan 15, 2013 12:29 pm

Admin

avatar

Olá, estarei disponibilizando uma barra de porcentagem feita por mim, fiquei uma hora nela, para deixar agradável...

Bom, primeiro terá que adicionar este código ao seu CSS.

Código:
.barra1 {
background-color: #33CC33;
height: 10px;
display: inline-block;
}
.barra2 {
border: 1px solid #008C05;
width: 100px;
height: 10px;
padding: 1px;
display: inline-block;
}

Agora, é só colocar este código na sua assinatura.

Código:
Conhecimento em CSS: <div class="barra2"><div class="barra1" style="width: 75px;"></div></div> 75/100
Conhecimento em HTML: <div class="barra2"><div class="barra1" style="width: 90px;"></div></div> 90/100
Conhecimento em JavaScript: <div class="barra2"><div class="barra1" style="width: 5px;"></div></div> 5/100

Para alterar os valores, baste editar o width de cada porcentagem. Cada 1px seria 1% na barra, e depois disso, só altere do lado a porcentagem, para ficar visível pela barra, e pelo texto.

Prévio.

Conhecimento em CSS:
75/100
Conhecimento em HTML:
90/100
Conhecimento em JavaScript:
5/100

OBS: Se querer centralizar ele no post, você terá de editar o CSS.

2 Re: Barra de porcentagem em Ter Jan 15, 2013 12:37 pm

Quakeline

avatar
Olá,

As minhas vai ficar tudo 100% kk -zoa

Obrigado por compartilhar este código que você fez

Até



[Você precisa estar registrado e conectado para ver esta imagem.]
[Você precisa estar registrado e conectado para ver esta imagem.]

Meus Trabalhos


Assinaturas

Spoiler:
[Você precisa estar registrado e conectado para ver esta imagem.]

3 Re: Barra de porcentagem em Ter Jan 15, 2013 1:23 pm

iTunnez

avatar
Rs, fico Show !



Virou meu fã? Percebeu que sou foda? Use a Carteirinha!

[Você precisa estar registrado e conectado para ver esta imagem.]

Spoiler:
[Você precisa estar registrado e conectado para ver esta imagem.]

4 Re: Barra de porcentagem em Qua Jan 16, 2013 9:58 am

wizard

avatar
muito bacana obrigado por compartilhar ai conosco



[Você precisa estar registrado e conectado para ver esta imagem.]

Conteúdo patrocinado


Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo  Mensagem [Página 1 de 1]

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum