Renk Renk Css Buton - MyBB

[#Captain]

Admin KP - Şablon & Stil - Kullandığınız Tema - Css ekleye tıklıyoruz..

Dosya adı: buton.css
İlişkilendirilen: Genel
Kendi içerimi Yaz'a tıklayıp aşağıdaki kodları ekliyoruz, hangi renk yapmak istiyorsanız onun kodunu eklemelisiniz..

>.< Css Kodları >.<

- Mor Buton -

Kod: Tümünü Seç Tümünü Kopyala

.button {
    border-top: 1px solid #de8ad8;
    background: #6b2759;
    background: -webkit-gradient(linear, left top, left bottom, from(#9c4c9c), to(#6b2759));
    background: -webkit-linear-gradient(top, #9c4c9c, #6b2759);
    background: -moz-linear-gradient(top, #9c4c9c, #6b2759);
    background: -ms-linear-gradient(top, #9c4c9c, #6b2759);
    background: -o-linear-gradient(top, #9c4c9c, #6b2759);
    padding: 5px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
    -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
    box-shadow: rgba(0,0,0,1) 0 1px 0;
    text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: white;
    font-size: 14px;
    font-family: Helvetica, Arial, Sans-Serif;
    text-decoration: none;
    vertical-align: middle;
    }
.button:hover {
    border-top-color: #663269;
    background: #663269;
    color: #ccc;
    }
.button:active {
    border-top-color: #3b0840;
    background: #3b0840;
    }

- Yeşil Buton -

Kod: Tümünü Seç Tümünü Kopyala

.button {
    border-top: 1px solid #97f7c1;
    background: #65d69f;
    background: -webkit-gradient(linear, left top, left bottom, from(#3e9c72), to(#65d69f));
    background: -webkit-linear-gradient(top, #3e9c72, #65d69f);
    background: -moz-linear-gradient(top, #3e9c72, #65d69f);
    background: -ms-linear-gradient(top, #3e9c72, #65d69f);
    background: -o-linear-gradient(top, #3e9c72, #65d69f);
    padding: 5px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
    -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
    box-shadow: rgba(0,0,0,1) 0 1px 0;
    text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: white;
    font-size: 14px;
    font-family: Georgia, serif;
    text-decoration: none;
    vertical-align: middle;
    }
.button:hover {
    border-top-color: #28785a;
    background: #28785a;
    color: #ccc;
    }
.button:active {
    border-top-color: #1b5c3f;
    background: #1b5c3f;
    }

- Mavi Buton -

Kod: Tümünü Seç Tümünü Kopyala

.button {
    border-top: 1px solid #979cf7;
    background: #6865d6;
    background: -webkit-gradient(linear, left top, left bottom, from(#3e409c), to(#6865d6));
    background: -webkit-linear-gradient(top, #3e409c, #6865d6);
    background: -moz-linear-gradient(top, #3e409c, #6865d6);
    background: -ms-linear-gradient(top, #3e409c, #6865d6);
    background: -o-linear-gradient(top, #3e409c, #6865d6);
    padding: 5px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
    -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
    box-shadow: rgba(0,0,0,1) 0 1px 0;
    text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: white;
    font-size: 14px;
    font-family: Georgia, serif;
    text-decoration: none;
    vertical-align: middle;
    }
.button:hover {
    border-top-color: #282c78;
    background: #282c78;
    color: #ccc;
    }
.button:active {
    border-top-color: #1b1c5c;
    background: #1b1c5c;
    }

- Pembe Buton -

Kod: Tümünü Seç Tümünü Kopyala

.button {
    border-top: 1px solid #cf97f7;
    background: #a765d6;
    background: -webkit-gradient(linear, left top, left bottom, from(#7a3e9c), to(#a765d6));
    background: -webkit-linear-gradient(top, #7a3e9c, #a765d6);
    background: -moz-linear-gradient(top, #7a3e9c, #a765d6);
    background: -ms-linear-gradient(top, #7a3e9c, #a765d6);
    background: -o-linear-gradient(top, #7a3e9c, #a765d6);
    padding: 5px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
    -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
    box-shadow: rgba(0,0,0,1) 0 1px 0;
    text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: white;
    font-size: 14px;
    font-family: Georgia, serif;
    text-decoration: none;
    vertical-align: middle;
    }
.button:hover {
    border-top-color: #642878;
    background: #642878;
    color: #ccc;
    }
.button:active {
    border-top-color: #441b5c;
    background: #441b5c;
    }

- Sarı Buton -

Kod: Tümünü Seç Tümünü Kopyala

.button {
    border-top: 1px solid #f7ef97;
    background: #d6cd65;
    background: -webkit-gradient(linear, left top, left bottom, from(#9c973e), to(#d6cd65));
    background: -webkit-linear-gradient(top, #9c973e, #d6cd65);
    background: -moz-linear-gradient(top, #9c973e, #d6cd65);
    background: -ms-linear-gradient(top, #9c973e, #d6cd65);
    background: -o-linear-gradient(top, #9c973e, #d6cd65);
    padding: 5px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
    -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
    box-shadow: rgba(0,0,0,1) 0 1px 0;
    text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: white;
    font-size: 14px;
    font-family: Georgia, serif;
    text-decoration: none;
    vertical-align: middle;
    }
.button:hover {
    border-top-color: #787728;
    background: #787728;
    color: #ccc;
    }
.button:active {
    border-top-color: #5a5c1b;
    background: #5a5c1b;
    }

- Turuncu Buton -

Kod: Tümünü Seç Tümünü Kopyala

.button {
    border-top: 1px solid #fc8f3c;
    background: #ff6200;
    background: -webkit-gradient(linear, left top, left bottom, from(#ed8c42), to(#ff6200));
    background: -webkit-linear-gradient(top, #ed8c42, #ff6200);
    background: -moz-linear-gradient(top, #ed8c42, #ff6200);
    background: -ms-linear-gradient(top, #ed8c42, #ff6200);
    background: -o-linear-gradient(top, #ed8c42, #ff6200);
    padding: 5px 10px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
    -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
    box-shadow: rgba(0,0,0,1) 0 1px 0;
    text-shadow: rgba(0,0,0,.4) 0 1px 0;
    color: white;
    font-size: 14px;
    font-family: Georgia, serif;
    text-decoration: none;
    vertical-align: middle;
    }
.button:hover {
    border-top-color: #ff6200;
    background: #ff6200;
    color: #ccc;
    }
.button:active {
    border-top-color: #9e3200;
    background: #9e3200;
    }