* * * * * * * [phpbb3 tarzı kategori] Yeni Css ler

Tüm Kodların Konulacak tek yeri

Yönetim paneli--afiş asmak--(solda)renkler.. css styleer

SADECE MOZİLLADA GEÇERLİDİR



Enlarge this imageReduce this image Click to see fullsize


Kod:th {
color: #ffa34f;
font-size: 11px;
font-weight : bold;
background-color: blue;
height: 25px;
-moz-border-radius: 15px;

}
.forumline{
background-color: #ffffff;
-moz-border-radius: 15px;
border-color: red;
}


red=kenarlık rengi





Kod:.forumline{
background-color: #ffffff;
-moz-border-radius: 15px;
border-color: red;
}

red= kenarlık rengi



Enlarge this imageReduce this image Click to see fullsize



önce



sonra



Kod:.postdetails{
font-size : 10px;
color : red;
font-family : Comic Sans MS;
}

10 = yazı büyüklüğü
red = cevapların rengi(nerden,doğum tarihi vs..)
Comic Sans MS => yazı fontu

bunları değiştirebilirsiniz

Enlarge this imageReduce this image


lılıllı..Profil kutusunun rengini değiştirme..ıllılıl

Kod:fieldset { border:5px solid green }
legend {
padding: 0.2em 0.5em;
border:3px solid red;
font-size:90%;
text-align:right;
}


5=> tabloların kalınlığı... arttırabilir veya azaltabilirsiniz..
green=>tabloların rengi... değiştirebilirsiniz..
3=> kutucuğun kalınlığı... arttırabilir veya azaltabilirsiniz..
red=>kutucuğun rengi... değiştirebilirsiniz..

önce


Enlarge this imageReduce this image Click to see fullsize


sonra


Enlarge this imageReduce this image

Enlarge this imageReduce this image


lılıllı..Ön Profile Arkaplan koyma..ıllılıl

Spoiler:
Enlarge this imageReduce this image




Kod:/* Advanced profile */
#profile-advanced-avatar
.module, #profile-advanced-points .module, #profile-advanced-reputation
.module, #profile-advanced-details {
margin-right: 3px;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}
#profile-advanced-avatar
.module, #profile-advanced-points .module, #profile-advanced-reputation
.module, #profile-advanced-right .module {
margin-bottom: 3px;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}
#profile-advanced-button {
padding: 1px;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}
#profile-advanced-details {
overflow: hidden;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}
#profile-advanced-details ol {
margin: 0;
padding: 0;
list-style: none;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}
#profile-advanced-details ol li {
display: block;
margin-bottom: 4px;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}
#profile-advanced-details .avatar {
float: left;
background-image: url("https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif");
}


https://2img.net/r/ihimizer/img149/7673/flash61trabzonspor16001gl4.gif=> yerine istediğiniz resmin url sini koyun ..

HER RESİM AYRI BİR SAYFA SEÇENEĞİDİR(istatistikler,,profil vs..) HER SAYFAYA FARKLI RESİM KOYABİLİRSİNİZ

Enlarge this imageReduce this image


lılıllı..Sayfa konumunu silme..ıllılıl

Kod:.nav{
font-weight: bold;
font-size: 0px;
color : #536482;
}


Önce


Enlarge this imageReduce this image Click to see fullsize


Sonra


Enlarge this imageReduce this image

Enlarge this imageReduce this image


lılıllı..BBCODE leriİ Değiştirme..ıllılıl

Enlarge this imageReduce this image Click to see fullsize


Kod:button.button2, input.button2 {

font-size: 0.7em;
border: 1px solid #BCBCBC;
width: auto !important;
padding: 1px 0px;
font-family: Arial,Verdana,Tahoma,sans-serif;
color: #000000;
background-repeat: repeat-x;
background-image: url("https://i.servimg.com/u/f44/12/44/30/06/header10.png");
background-position: top;
overflow: visible;
vertical-align:middle;
-moz-border-radius: 15px;
border : 1px solid green;
font-family : "Courier New", Courier, monospace;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}


button.bbcode {
background-image: url("http://www.trabzonspor.org.tr/Upload/Sporcu/buyuk/alanzinho.jpg");
-moz-border-radius: 15px;
border : 1px solid red;
font-family : "Courier New", Courier, monospace;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}


https://i.servimg.com/u/f44/12/44/30/06/header10.png=> basılmadan önceki resim.
http://www.trabzonspor.org.tr/Upload/Sporcu/buyuk/alanzinho.jpg=>basıldıktan sonraki resim.

green=> basılmadan önceki kenarlık rengi
red=>basıldıktan sonraki i kenarlık rengi

Enlarge this imageReduce this image


lılıllı..Nicki Şekillendirin...ıllılıl

Kod:.name{
font-size : 11px;
color : #fcfcfc;
-moz-border-radius: 15px;
background-image: url("https://i.servimg.com/u/f44/12/44/30/06/header10.png");
border : 1px solid #000000;
font-family : Bleeding Cowboys;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}


font-size : 11px; boyutudur..büyütebilirsiniz..

https://i.servimg.com/u/f44/12/44/30/06/header10.png :> yerine istediğğiniz remi koyabilirsiniz..

Bleeding Cowboys;=> yerine herhangi bir yazı fontu

arka plana renk koymak istiyorsanız


Kod:.name{
font-size : 11px;
color : #fcfcfc;
-moz-border-radius: 15px;
background-color: red;
border : 1px solid #000000;
font-family : Bleeding Cowboys;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}

red=> yerine herhangi bir renk koyabilirsiniz..

Enlarge this imageReduce this image


lılıllı..Hızlı Mesaj Kutusunu Oval Yapma....ıllılıl

Enlarge this imageReduce this image Click to see fullsize


Kod:form#quick_reply textarea#text_editor_textarea {
width: 100% !important;
height: 100%;
-moz-border-radius: 15px;
background-image: url("https://i.servimg.com/u/f44/12/44/30/06/header10.png");
border : 1px solid #000000;
font-family : "Courier New", Courier, monospace;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}

Kod:https://i.servimg.com/u/f44/12/44/30/06/header10.png

bunun yerine istediğiniz resmi koyabilrsiniz

#000000=>buda kenarlık rengi.. istediğiniz rengi koyabilirsiniz..

SADECE MOZİLLA DA ÇALIŞIR

Enlarge this imageReduce this image

lılıllı..Dikdörtgen Seçenekleri Oval Yapma....ıllılıl[/center]


Enlarge this imageReduce this image


___Mozilla___

Kod:input{
-moz-border-radius: 15px;
background-color : #eaf9ff;
border : 1px solid #000000;
font-family : "Courier New", Courier, monospace;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}


SADECE MOZİLLA DA ÇALIŞIR

Enlarge this imageReduce this image


lılıllı..Mesaj yazılarını değiştirme.ıllılıl

önce



sonra



Kod:.postbody{
font-size : 12px;
line-height: 18px;
color:red;
font-family: Comic Sans MS;
font-weight: bold;
}


12=yazının büyüklüğü..değiştirebilirisniz
18= yazıyla imza arasındaki mesafe..değiştirebilirisniz
red=imza çizgisi ve yazı rengi..değiştirebilirsiniz..ama ayrı ayrı değil..ikiside aynı renk olur
Comic Sans MS=yazı fontu..değiştirebilirisniz
font-weight: bold;=kalın yazı... çıkartabilirsiniz..

Enlarge this imageReduce this image

ıllı..Butonları şekillendirme..ıllılıl



Kod:input.mainoption {
background-color : ;
background-color: red;

font-weight : bold;
-moz-border-radius: 15px;
background-color: red;

border : 1px solid #000000;
font-family : Bleeding Cowboys;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}
input.liteoption {
background-color: red;
font-weight : normal;
-moz-border-radius: 15px;
background-color: red;
border : 1px solid #000000;
font-family : Bleeding Cowboys;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}


Bleeding Cowboys yerine yazı fontu

red yerine ingilizce renk

ılıllı..Mesaj Yazılan Yerin Arkplanını Değiştirme..ıllılıl


Enlarge this imageReduce this image Click to see fullsize


Kod:#text_editor_textarea {
background-image: url('https://2img.net/r/ihimizer/img42/1532/screenshot002v.png');
}

https://2img.net/r/ihimizer/img42/1532/screenshot002v.png

yerine herhangi bir resim url si




Enlarge this imageReduce this image Click to see fullsize


Kod:form#quick_reply textarea#text_editor_textarea {
width: 100% !important;
height: 100%;
background-image: url("https://2img.net/r/ihimizer/img42/1532/screenshot002v.png");
}

https://2img.net/r/ihimizer/img42/1532/screenshot002v.png

yerine herhangi bir resim url si




Enlarge this imageReduce this image



Kod:.quote{
font-family: Verdana,Arial,Helvetica,sans-serif;
font-size: 11px;
background-image: url("http://www.turkiyemiz.gen.tr/turkiye-b.jpg");
color: #444444;
line-height: 125%;
border: #d1d7dc;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
}

http://www.turkiyemiz.gen.tr/turkiye-b.jpg => resmimiz..istediğiniz resmi koyabilirsiniz..
Verdana,Arial,Helvetica,sans-serif => yazı fontları... değiştirebilirsiniz..
11px; => yazı büyüklüğü.. değiştirebilirsiniz..
line-height: 125%; => genişlik.. Ayarlayabilirsiniz..küüçültürseniz daha iyi olur
color: #444444; => yazı rengi.. #444444 yerine renk html kodu..yada ingilizce renk koyabilirsiniz
border: #d1d7dc; => kenarlık rengi . #d1d7dc yerine renk html kodu..yada ingilizce renk koyabilirsiniz

border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;

=> bunlar kenarlığın kalınlıkları.. arttırırsanız kalınlaşır..yani 1 leri yükseltin..

Code için.. üsttekilerin aynısı geçerli...

Kod:.code{
font-family: Courier,Courier New,sans-serif;
font-size: 11px;
background-image: url("http://www.turkiyemiz.gen.tr/turkiye-b.jpg");
color: #006600;
background-color: #fafafa;
border: #d1d7dc;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px}



Kod:.name{
font-size : 12px;
color : #707070;
}

12px; bunu ayarlayıın




Kod:/* Chatbox */
body.chatbox {
min-width: 550px !important;
background-image: url("https://i.servimg.com/u/f44/12/44/30/06/header10.png");
padding: 0;
margin: 0;
background-color: #000000;
}

https://i.servimg.com/u/f44/12/44/30/06/header10.png = kodda bunun yerine istediğiniz resmin url sini koyabilirsinz.




Enlarge this imageReduce this image


Kod:img{
border:0;
-moz-border-radius: 15px;
background-image: url("https://i.servimg.com/u/f44/12/44/30/06/header10.png");
border : 1px solid #000000;
font-size : 12px;
padding-left : 7px;
padding-right : 7px;
}


https://i.servimg.com/u/f44/12/44/30/06/header10.png=> yerine istediğiniz resmin url si.

Not: TÜM RESİMLER İÇİN GEÇERLİDİR

Enlarge this imageReduce this image Click to see fullsize


Kod:form#quick_reply textarea#text_editor_textarea {
width: 100% !important;
height: 100%;
}

100 leri isteğe göre ayarlayın

Enlarge this imageReduce this image Click to see fullsize


Kod:table{
-moz-border-radius: 10px;
background-color : #FFFFFF;
border : 1px solid #000000;
font-family : Arial, Verdana, Helvetica, sans-serif;
font-size : 12px;
padding-left : 3px;
padding-right : 3px;
}

Kod:/*
This is the outline round the main forum tables */ .forumline {
background-color: #fff; border: 18px solid; border-color: red blue;
}



red =>birinci renk...red yerine harhangi bir renk yada renk kodu

blue=>İkinci renk...blue yerine harhangi bir renk yada renk kodu

18 => Kalınlık..değiştirebilirsiniz

arka plan isterseniz..

kodda ki bu

#fff

nun yerine harhangi bir renk yada renk kodu koyabilirsiniz..






Kod:.vote .vote-bar {
width: 3px;
height: 50px;
margin: 0 auto;
border: 1px solid white;
font-size: 0;
}
.vote .vote-no-bar {
letter-spacing:-2px;
margin-left:-2px;
white-space:nowrap;
}
.vote .vote-bar-plus {
background-color: green;
}
.vote .vote-bar-minus {
background-color: red;
}


solid white; => white... kenarlık rengi... istediğiniz gibi renk kodu yada ingilizce renk kullanabilirsiniz...

background-color: green; => green... olumlu rep rengi... istediğiniz gibi renk kodu yada ingilizce renk kullanabilirsiniz...

background-color: red;=> red... olumsuz rep rengi... istediğiniz gibi renk kodu yada ingilizce renk kullanabilirsiniz...

html renkleri için Buraya Tıkla



bu kod için

Kod:.code{
font-family: Courier,'CourierNew',sans-serif;
font-size: 11px;
color: #859875;
background-color: #d9a164;
border: #212121;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px}


color: #859875; => bu yazı rengi.. bunu istediğiniz renk yapabilirsiniz..
background-color: #d9a164; => bu arka plan rengi.. bunu istediğiniz renk yapabilirsiniz..
border: #212121; => buda kenarlık rengi bunu istediğiniz renk yapabilirsiniz.
font-family: Courier,'CourierNew',sans-serif; => bu yazı fontları..değiştirebilrsiniz.
font-size: 11px; =>bu yazı boyutu..değiştirebilirsiniz..


buda alıntı için

özellikleri yukardaki gibi
Kod:.quote{
font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;
font-size: 11px;
color: #555555;
line-height: 125%;
background-color: #d9a164;
border: #212121;
border-style: solid;
border-left-width: 1px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px}

ılıllı..Moderatör Yazısının Rengini Değiştirme..ıllılıl




Kod:.mod-text {
font-weight: bold;
color : red;
}
red yerine herhangi bir renk





Kod:.mod-text {
font-weight: bold;
font-size: 0px;
}


Kod:/* ************************Posts************************ */
.post {
background-image: url('https://2img.net/r/ihimizer/img198/7281/mansaremuro61.gif');
border-bottom: 10px solid #990202;
}

https://2img.net/r/ihimizer/img198/7281/mansaremuro61.gif

yerine istediğiniz resmi koyabilrsiniz



Kod:.row1,.row2 {
border-bottom: 1px solid #131313 !important;
}
.row1 {

background-repeat: repeat-x;
border-left: solid 1px #404040;
border-right: solid 1px #121212;
border-top: solid 1px #3C3C3C;
border-bottom: solid 1px #131313;
}

.row2 {
background-repeat: repeat-x;
border-left: solid 1px #404040;
border-right: solid 1px #121212;
border-top: solid 1px #3C3C3C;
border-bottom: solid 1px #131313;
}

Önce


Enlarge this imageReduce this image Click to see fullsize


Sonra


Enlarge this imageReduce this image Click to see fullsize





Enlarge this imageReduce this image


Kod:/* Submenu */
#submenu {
background-image: url('https://i.servimg.com/u/f72/12/12/58/19/nav10.png');
border-left: 1px solid #fffff;;
border-bottom: 1px solid #fffff;;
border-right: 1px solid #fffff;
border-top: 1px solid #fffff;
background-repeat: repeat-x;
height: 30px;
margin-bottom: -14px;
color: #fffff;

}


https://i.servimg.com/u/f72/12/12/58/19/nav10.png

bunun yerine istediğiniz resmi koyabilirsiniz..

Muro dan sevgiler Alıntıdır :zten % 10000 alıntı :