Publicidade na Web
Gostaria de reagir a esta mensagem? Crie uma conta em poucos cliques ou inicie sessão para continuar.

[TUTORIAL] Footer Elegante V1

Publicidade na Web :: Publicidade na WEB :: Tutoriais, dicas e astúcias

Ir para baixo

Tutorial [TUTORIAL] Footer Elegante V1

Mensagem por Michelangelo Sex Ago 09, 2013 7:33 am


[TUTORIAL] Footer Elegante V1 Alerte10
[TUTORIAL] Footer Elegante V1

Neste Tutorial,Iremos adicionar um código css para deixar o footer mais bonito.

Funcional em PUNBB


--> Tutoriais, dicas e astúcias <--
[TUTORIAL] Footer Elegante V1



1º - Código CSS
Painel de Controle [TUTORIAL] Footer Elegante V1 633772Visualizações [TUTORIAL] Footer Elegante V1 633772Imagens e Cores [TUTORIAL] Footer Elegante V1 633772Cores [TUTORIAL] Footer Elegante V1 633772Folha de Estilo CSS

Código:

    #pun-navlinks, #pun-foot,#pun-about {
    background-image: -moz-linear-gradient(#313029, #58564A 10%, #313029);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 10% 100%, from(#313029), to(#58564A), to(#313029));
    background-image: -webkit-linear-gradient(#313029, #58564A 10%, #313029);
    background-image: -o-linear-gradient(#313029, #58564A 10%, #313029);
    border: none;
    height: 150px;
    }
    #pun-navlinks a, #pun-foot a,#pun-about a {color:white;text-decoration:none;}

    #pun-foot {
    border-top: 5px solid #21C8FF;
    color: #666;
    margin: 0;
    width: 100%;
    }
    #pun-foot .center {
        background-color: rgb(48, 47, 47);
        border-top: 2px solid #494949;
        padding: 10px;
        font-size: 14px;
        font-family: Calibri,Arial;
        text-transform: uppercase;
        margin-top: -13px;
    }
    #pun-about #qjump fieldset {
    }
    #qjump {
        float: right !important;
        padding: 13px;
        text-align: right !important;
        color: white;
    }
    #pun-foot::after {
    content: "Por LucasRPG";
    color: #424242;
    display: block;
    margin: -31px;
    font-size: 11px;
    margin-left: 834px;
    }
    #pun-about ul li {
        float: left;
        font-size: 0px;
        margin: 13px;
    }
    #pun-about ul li a {
        display: block;
        font-size: 10px;
        line-height: 7px;
        text-align: left;
    }
    #qjump input[type="submit"] {
        padding: 5px;
        background-color: rgb(238, 238, 238);
        border: 2px solid rgb(213, 213, 213);
        border-radius: 7px;
    }
[TUTORIAL] Footer Elegante V1 633772Valide


2º - Resultado
[TUTORIAL] Footer Elegante V1 Efr9Nap



  • Créditos?
    LucasRPG





© Publicidade na WEB


[TUTORIAL] Footer Elegante V1 Act_bottom Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[TUTORIAL] Footer Elegante V1
Michelangelo
Michelangelo
Admin

Masculino
Mensagens : 30
Reputação : 4

https://publicidadenaweb.forumeiros.com

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

Publicidade na Web :: Publicidade na WEB :: Tutoriais, dicas e astúcias

 
Permissões neste sub-fórum
Não podes responder a tópicos