Advertisement:

Author Topic: Css Temel Terimleri  (Read 102861 times)

Offline Arbalot

  • SMF Hero
  • ******
  • Posts: 3,635
  • Gender: Male
  • SMF Hastası
    • SMF Destek
Css Temel Terimleri
« on: June 12, 2006, 03:18:16 AM »
1.Css Nedir?
2.Link
3.Liste
4.KIn
5.Font (Yazi Tipi)
6.Text (Metin)
7.Imleç
8.Zemin
9.Tablo
10.Scroll Bar






Css Nedir?
HTML bize metin biçimlendirme alanında çok geniş olanaklar sunar. CSS, uzun yazılışıyla Cascading Style Sheets, veya Türkçesiyle Stil şablonları ise bunu bir adım daha öteye götürür, bize sayfalarımız için global şablonlar hazırlama olanağı verdiği gibi, tek bir harfin stilini; yani renk,  font, büyüklük gibi özelliklerini değiştirmek için de kullanılabilir. Bu tekniğin en önemli özelliği kullanımındaki bu esnekliğidir.
Bir web sayfası içerisinde zaten estetik kuralları gereği yüzlerce renk ve font kullanmayız. Genelde birbiriyle uyumlu birkaç renk ve birkaç font kullanırız ki, bunları her sayfada ayrı ayrı tekrar belirtmek yerine CSS yardımıyla bir sefer tanımlayıp bütün web sayfamızda kullanabiliriz.Bu şekilde güncelleme yaparken de onlarca sayfayı değiştirmekten kurtuluruz.
CSS kodları HTML kodlarının içine yazılırlar. Türüne göre body veya head bölümlerinde yer alabilirler. Bunların dışında harici CSS dosyaları oluşturulup bunlar gerektiğinde HTML belgesi içerisinde çağırılabilirler.
Hemen hemen her konuda olduğu gibi CSS konusunda da Microsoft Internet Explorer ve Netscape farklı yorumlar ortaya koyarlar. Bu noktada her iki browser'ın da aynı/benzer yorumlayacağı kodlar yazmak en uygunudur.

LİNK ÖZELLİKLERİ
a :Linkin, sayfa açıldığında tıklanmadan veya ümleç üzerine getirilmeden önceki durumudur.
a:hover :Linkin imleç üzerine getirildiğindeki durumudur.
a:active :Linkin tıklandığı andaki durumudur.
a:visited :Linkin tıklandıktan sonraki durumudur.


BİÇİMLENDİRME:
color:Linkin rengini belirler.
background-color:Linkin zemin rengini belirler.
background-image:Linkin zeminine resim ekler(Bu animated-gif de olabilir.)
text-decoration:Linkin altının,üstünün vs. çizgili olup olmayacağını belirler.
font-weight:Yazının kalınlık veya inceliğini belirler.
border:Linkin etrafına kenarlık ekler.
display:Linki içeren hücre , satır vb. istenilen alanın seçilmesini sağlar.

LİSTE ÖZELLİKLERİ
disk:Liste biçiminin disk (içi dolu daire) şeklinde olmasını sağlar.
circle : Liste biçiminin çember şeklinde olmasını sağlar.
square : Liste biçiminin kare olmasını sağlar.
decimal : Liste biçiminin rakamlardan oluşmasını sağlar.
lower-roman : Liste biçiminin i,ii,iii gibi küçük roma rakamlarından oluşmasını sağlar.
upper-roman : Liste biçiminin I,II,II gibi büyük roma rakamlarından oluşmasını sağlar.
lower-alpha : Liste biçiminin a,b,c şeklinde küçük harf olmasını sağlar.
upper-alpha : Liste biçiminin A,B,C şeklinde büyük harf olmasını sağlar.
none : Listenin simgesiz olmasını sağlar.
inside : Listenin ikinci satırının en soldan başlamasını sağlar.
Outside : Listenin ikinci satırının ilk satır ile aynı yerden başlamasını sağlar.
list-style-image : Liste biçiminin resim olmasını sağlar.

KIN ÖZELLİKLERİ
position:KInın yerinin belirlenmesini sağlar.
absolute:KInın yerinin pencere esas alınarak belirlenmesini sağlar.
relative: KInın yerinin bir önceki kIn esas alınarak belirlenmesini sağlar.
static:KInın yerinin sabit olarak (Varsayılan olan sol üst köşe) belirlenmesini sağlar.
top:KInın üstten ne kadar aşağıda olması gerektiğini belirler.
left:KInın soldan ne kadar içeride olması gerektiğini belirler.
width:KInın genişliğinin ne kadar olacağını belirler.
height:KInın yüksekliğinin ne kadar olacağını belirler.
overflow:KInın belirtilen yükseklik ve genişliğe sığmayan kısmına ne olacağını belirler.
auto:Otomatik olarak belirlenir.
scroll:Kaydırma çubuğu ekleyerek görünmesini sağlar.
visible : KInı belirtilen boyutların dışına taşırarak sığmayan yerlerin görünmesini sağlar.
hidden:Sığmayan yerleri gizler.
visibility:KInın görünebilirlik ayarını yapar.
visible : KInın görünür olmasını sağlar.
hidden:KInı gizler.
z-index : KInların alttan üste doğru hangi sıra ile gösterileceğini belirler.1 değeri kInın en altta olacağını belirtir.


FONT ÖZELLİKLERİ
font-family:Yazı türünü belirler.(Arial , Verdana gibi.)
font-style:Yazının normal veya sağa eğik olmasını sağlar.
font-variant:Yazının normal veya tümünün büyük harflerden oluşmuş olmasını sağlar.
font-weight:Yazının kalınlık-inceliğini belirler.
font-size:Yazının büyüklüğünü belirler.

TEXT ÖZELLİKLERİ
word-spacing : Kelimeler arasında bırakılacak boşluğu boşluğu belirler.
letter-spacing : Harfler arasında bırakılacak boşluğu boşluğu belirler.
text-decoration : Kelimenin altının , üstünün vs. çizili olup olmayacağını belirler.
underline : Kelimenin altının (Satır altından) çizili olmasını sağlar.
overline : Kelimenin üstünün (Satır üstünden) çizili olmasını sağlar.
line-through : Kelimenin ortasından çizili olmasını sağlar.
blink : Kelimenin yanıp sönmesini sağlar.(Netscape için)
vertical-align : Metnin yatay olarak nasıl hizalanacağını belirler.
text-transform: Kelimelerin büyük harf veya küçük harflerden oluşmasını sağlar.
capitalize : Kelimelerin ilk harflerinin büyük olmasını sağlar.
uppercase : Kelimelerin bütün harflerinin büyük olmasını sağlar.
lowercase : Kelimelerin bütün harflerinin küçük olmasını sağlar.
none : Kelimelerin orjinal metindeki gibi olmasını sağlar.
text-align: Metnin dikey olarak nasıl hizalanacağını belirler.
left : Metni sola yaslar.
right : Metni sağa yaslar.
center : Metni ortalar.
justify : Metni iki yana yaslar.
text-indent : Metnin ilk satırının soldan ne kadar içerden başlayacağını belirler.
line-height : Satırın yüksekliğini ayarlar.(Yüksek değer verildiğinde satırlar arasındaki boşluk artar.)
first-line : Metnin ilk satırının biçimlendirilmesini sağlar.
first-letter : Metnin ilk harfinin biçimlendirilmesini sağlar.

İMLEÇ ÖZELLİKLERİ
crosshair:İmlecin artı işareti şeklinde olmasını sağlar.
auto:İmlecin metinde dikey çizgi ,boş alanda normal ok şeklinde olmasını sağlar.
default:İmlecin hem metinde hem de boş alanda normal ok şeklinde olmasını sağlar.
hand:İmlecin linkte olduğu gibi el şeklinde olmasını sağlar.
move:İmlecin taşıma işareti şeklinde olmasını sağlar.
ne-resize:İmlecin sağa yatık normal ok olmasını sağlar.
nw-resize:İmlecin sola yatık normal ok olmasını sağlar.
se-resize:İmlecin yukardan aşağı doğru ve sağa yatık normal ok olmasını sağlar.
sw-resize:İmlecin yukardan aşağı doğru ve sola yatık normal ok olmasını sağlar.
n-resize:İmlecin aşağıdan yukarıya doğru ince ok şeklinde olmasını sağlar.
s-resize:İmlecin yukardan aşağı doğru ince ok şeklinde olmasını sağlar.
w-resize:İmlecin sola doğru ince ok şeklinde olmasını sağlar.
e-resize:İmlecin sağa doğru ince ok şeklinde olmasını sağlar.
text:İmlecin hem metinde hem de boş alanda metinde olduğu gibi görünmesini sağlar.
wait:İmlecin meşgul animasyonuna dönüşmesini sağlar.
help:İmlecin yardım-soru işaretine dönüşmesini sağlar


ZEMİN ÖZELLİKLERİ
background-color: Zeminin rengini belirler.
#color : Renk adı.
transparent: Zeminin saydam olmasını sağlar.
background-image: Zemine resim yerleştirilmesini sağlar.
url : Zemine yerleştirilen resmin adresi.
background-repeat: Zemine yerleştirilen resmin nasıl yayılacağını belirler.
repeat : Resmin bütün zemine yayılmasını sağlar.
repeat-x : Resmin sol-üstten sağ-üste doğru yayılmasını sağlar.
repeat-y : Resmin sol-üstten sol-alta doğru yayılmasını sağlar.
no-repeat: Resmin yayılmadan orjinal boyutuyla görünmesini sağlar.
background-attachment: Zemindeki resmin , sayfa kaydırma çubuğuyla hareket ettirildiğindeki durumunu belirler.
scroll : Sayfa hareket ettirildiğinde zeminin de kaymasını sağlar.
fixed: Sayfa kaydırılsa da zeminin sabit kalmasını sağlar
background-position: Zemindeki resmin istenilen şekilde yerleştirilmesini sağlar.
top : Resmi yukarı yerleştirir.
center : Resmi ortalar.
bottom : Resmi aşağı yerleştirir.
left : Resmi sola yerleştirir.
right: Resmi sağa yerleştirir.
...px : Resmin soldan istenilen ölçüde içerde olmasını sağlar.


TABLO ÖZELLİKLERİ
margin : Tablo ile pencerenin kenarları arasında bırakılacak boşluğu belirler.
margin-top : Tablo ile pencerenin üst kenarı arasında bırakılacak boşluğu belirler.
margin-right : Tablo ile pencerenin sağ kenarı arasında bırakılacak boşluğu belirler.
margin-bottom : Tablo ile pencerenin alt kenarı arasında bırakılacak boşluğu belirler.
margin-left : Tablo ile pencerenin sol kenarı arasında bırakılacak boşluğu belirler.

padding : Tablo kenarları ile tablo içeriği (Yazı vb.) arasında bırakılacak boşluğu belirler.
padding-top : Tablonun üst kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.
padding-right : Tablonun sağ kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.
padding-bottom : Tablonun alt kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.
padding-left : Tablonun sol kenarı ile tablo içeriği arasında bırakılacak boşluğu belirler.

border : Tablonun kenarlarının şekillendirilmesini sağlar.

border-top : Tablonun üst kenarının şekillendirilmesini sağlar.
border-left : Tablonun sol kenarının şekillendirilmesini sağlar.
border-bottom : Tablonun alt kenarının şekillendirilmesini sağlar.
border-right : Tablonun sağ kenarının şekillendirilmesini sağlar.

border-width :
Tablonun kenarlarının kalınlığını belirler.
border-top-width : Tablonun üst kenarının kalınlığını belirler.
border-right-width : Tablonun sağ kenarının kalınlığını belirler.
border-bottom-width : Tablonun alt kenarının kalınlığını belirler.
border-left-width : Tablonun sol kenarının kalınlığını belirler.

border-style : Tablonun kenarlık türünü belirler.
border-top-style : Tablonun üst kenarlık türünü belirler.
border-right-style : Tablonun sağ kenarlık türünü belirler.
border-bottom-style : Tablonun alt kenarlık türünü belirler.
border-left-style : Tablonun sol kenarlık türünü belirler.

border-color :
Tablonun kenarlarının rengini belirler.
border-top-color : Tablonun üst kenarının rengini belirler.
border-right-color : Tablonun sağ kenarının rengini belirler.
border-bottom-color : Tablonun alt kenarının rengini belirler.
border-left-color : Tablonun sol kenarının rengini belirler.

color : Tabloda geçen metnin rengini belirler.

width : Tablonon genişliğini belirler.

height : Tablonun yüksekliğini belirler.


NOT : Başlık "TABLO" olarak verildi Ancak bu nitelikler başta TD , TR , TH vs. olmak üzere hemen her etiket için kullanılabilir.CSS' yi özel kılan da zaten bu...


KAYDIRMA ÇUBUĞU ÖZELLİKLERİ
scrollbar-face-color :Kaydırma çubuğunun yüzey rengi , aynı zamanda zemini de etkiliyor.
scrollbar-base-color :Kaydırma çubuğununun sol ve üst kenarlıklarını çizgi halinde kaplıyor.
scrollbar-shadow-color :Sağ ve alt kenarlıkların gölge rengi.
scrollbar-highlight-color :Sol ve üst kenarlıkların gölge rengi,aynı zamanda zemini de etkiliyor.
scrollbar-arrow-color :Yön oklarının rengi

Kaydırma çubuğu, sadece Internet Explorer'da geçerlidir.

-Derlenmiştir.
« Last Edit: June 12, 2006, 05:57:36 AM by Arbalot »

Offline Harzem

  • SMF Hero
  • ******
  • Posts: 5,384
  • Gender: Male
  • I know, my avatar is nerve-wracking!
Re: Css Temel Terimleri
« Reply #1 on: June 12, 2006, 05:45:53 AM »
Hay maşşallah! Arbalot, seni SMF'nin genel dokümentasyon takımına alalım ;) Eline sağlık güzel olmuş. İstersen özellik isimlerini eğik yapabilirsin, mesela:

scrollbar-shadow-color :Sağ ve alt kenarlıkların gölge rengi.
scrollbar-highlight-color :Sol ve üst kenarlıkların gölge rengi,aynı zamanda zemini de etkiliyor.
scrollbar-arrow-color :Yön oklarının rengi

Offline NeoCooL

  • Semi-Newbie
  • *
  • Posts: 40
Re: Css Temel Terimleri
« Reply #2 on: June 12, 2006, 06:10:06 AM »
Mükemmel bi kaynak oluşturmuşsun bence sabit ellerine sağlık  ;D

Offline spirit31-31

  • Full Member
  • ***
  • Posts: 611
  • Gender: Male
  • Ben Foruma Forum Demem O Forum Smf Olmayınca
Re: Css Temel Terimleri
« Reply #3 on: June 12, 2006, 09:03:05 AM »
ooo :) Gözümsün Abi Eline yüreğine sağlık çok güzel olmuş...  :)

Eğer Forumunuz Rc2 'yse ve Kategori İçindeyken VeriTabanı (Mysql) Hatası Veriyorsa
http://www.simplemachines.org/community/index.php?topic=107023.0




Offline STRONGHOLD

  • Jr. Member
  • **
  • Posts: 281
  • Gender: Male
  • SMF MANIA
    • IDDAA
Re: Css Temel Terimleri
« Reply #4 on: June 14, 2006, 02:34:11 PM »
Arbolat dostum Süper olmuş...Eline Sağlık  ;D

Offline Sindorf

  • SMF Hero
  • ******
  • Posts: 1,635
  • Gender: Male
    • My personal website, with its own shape and taste :)
Re: Css Temel Terimleri
« Reply #5 on: June 14, 2006, 07:29:12 PM »
Arbalot'tan şahane bir çalışma... teşekkürler :) -- Ben hala bunun (CSS) kitabını okuyorum... Bitmedi aylardır... :)

Offline rocker_turan

  • Semi-Newbie
  • *
  • Posts: 19
Re: Css Temel Terimleri
« Reply #6 on: June 16, 2006, 04:55:44 PM »
Çok güzel yararlı bir bilgi olmuş saol...

Offline nailkoese

  • Semi-Newbie
  • *
  • Posts: 33
  • Gender: Male
    • cafeinn
Re: Css Temel Terimleri
« Reply #7 on: June 17, 2006, 08:35:05 AM »
eline sağlık harikalar yaratmışsın cok işimize yarayacak

Offline uyagan

  • Jr. Member
  • **
  • Posts: 260
  • Gender: Male
    • YeniDeneyim
Re: Css Temel Terimleri
« Reply #8 on: June 17, 2006, 06:22:28 PM »
mükemmel olmuş eline sağlık Arbalot  ;)

Offline SenSa

  • Jr. Member
  • **
  • Posts: 326
  • Bu Simpıl Meyşın Forumu ÇhooKkK SewiyoRum Yawww :)
Re: Css Temel Terimleri
« Reply #9 on: June 18, 2006, 11:53:41 AM »
Arkadaşlar birşey sorcam bu bisim default tema denen şeydeki style.css'de scrollbar kodları yok mu bana mı öyle gelio ?! :( (o kadar style.css'yi kurcaladım zamanında,ama daha şimdi bu konuyu gördüm 10 dklik iş olcaktı arbalot'un sayesinde ;) bi tek scrollbar'ı çözememiştim onuda halledemedim :(


Arkadaşlar buyrun bakın benim style.css:
Code: [Select]
/* Normal, standard links. */
a:link
{
color: #ff8000;
text-decoration: none;
}
a:visited
{
color: #ff8000;
text-decoration: none;
}
a:hover
{
text-decoration: underline;
}

/* Navigation links - for the link tree. */
.nav, .nav:link, .nav:visited
{
color: #000000;
text-decoration: none;
}
a.nav:hover
{
color: #ff8000;
text-decoration: underline;
}

/* Tables should show empty cells. */
table
{
empty-cells: show;
}

/* By default (td, body..) use verdana in black. */
body, td, th , tr
{
color: #000000;
font-size: small;
font-family: verdana, sans-serif;
}

/* The main body of the entire forum. */
body
{
background-color: #fafafa;
margin: 10px;
padding: 0px 30px 20px 30px;
        background-image: url('images/bg.gif');
}

/* Input boxes - just a bit smaller than normal so they align well. */
input, textarea, button
{
color: #ff8000;
font-family: verdana, sans-serif;
}
input, button
{
font-size: 100%;
}

textarea
{
font-size: 100%;
color: #000000;
font-family: verdana, sans-serif;
}

/* All input elements that are checkboxes or radio buttons. */
input.check
{
}

/* Selects are a bit smaller, because it makes them look even better 8). */
select
{
font-size: 90%;
font-weight: small;
color: #0ec4d8;
font-family: verdana, sans-serif;
}

/* Standard horizontal rule.. ([hr], etc.) */
hr, .hrcolor
{
height: 1px;
border: 0;
color: #0ec4d8;
background-color: #0ec4d8;
}

/* No image should have a border when linked */
a img{
border: 0;
}
/* A quote, perhaps from another post. */
.quote
{
color: #000000;
background-color: #D7DAEC;
border: 1px solid #000000;
margin: 1px;
padding: 1px;
font-size: x-small;
line-height: 1.4em;
}

/* A code block - maybe even PHP ;). */
.code
{
color: #000000;
background-color: #dddddd;
font-family: "courier new", "times new roman", monospace;
font-size: x-small;
line-height: 1.3em;
/* Put a nice border around it. */
border: 1px solid #000000;
margin: 1px auto 1px auto;
padding: 1px;
width: 99%;
/* Don't wrap its contents, and show scrollbars. */
white-space: nowrap;
overflow: auto;
/* Stop after about 24 lines, and just show a scrollbar. */
max-height: 24em;
}

/* The "Quote:" and "Code:" header parts... */
.quoteheader, .codeheader
{
color: #000000;
text-decoration: none;
font-style: normal;
font-weight: bold;
font-size: x-small;
line-height: 1.2em;
}

/* Generally, those [?] icons.  This makes your cursor a help icon. */
.help
{
cursor: help;
}

/* /me uses this a lot. (emote, try typing /me in a post.) */
.meaction
{
color: blue;
}

/* The main post box - this makes it as wide as possible. */
.editor
{
width: 96%;
}

/* Highlighted text - such as search results. */
.highlight
{
background-color: black;
font-weight: bold;
color: yellow;
}

/* Alternating backgrounds for posts, and several other sections of the forum. */
.windowbg
{
color: #000000;
background-color: #ECEDF3;
}
.windowbg2
{
color: #000000;
background-color: #F6F6F6;
}
.windowbg3
{
color: #000000;
background-color: #E0E1E8;
}
/* the today container in calendar */
.calendar_today
{
background-color: #FFFFFF;
}

/* These are used primarily for titles, but also for headers (the row that says what everything in the table is.) */
.titlebg, tr.titlebg th, tr.titlebg td, .titlebg2, tr.titlebg2 th, tr.titlebg2 td
{
color: blue;
font-style: small;
background-color: #E9F0F6;
background-image: url(images/titlebg.jpg);
border-bottom: solid 1px #9BAEBF;
border-top: solid 1px #FFFFFF;
background-repeat: repeat-x;
padding-left: 10px;
padding-right: 10px;
}
.titlebg, .titlebg a:link, .titlebg a:visited
{
font-weight: bold;
color: black;
font-style: normal;
}

.titlebg a:hover
{
color: #404040;
}
/* same as titlebg, but used where bold text is not needed */
.titlebg2 a:link, .titlebg2 a:visited
{
color: black;
font-style: normal;
text-decoration: underline;
}

.titlebg2 a:hover
{
text-decoration: underline;
}

/* This is used for categories, page indexes, and several other areas in the forum.
.catbg and .catbg2 is for boardindex, while .catbg3 is for messageindex and display headers*/
.catbg , tr.catbg td , .catbg3 , tr.catbg3 td
{
background-image: url(images/catbg.jpg);
background-color: #E9F0F6;
color: #000000;
padding-left: 10px;
padding-right: 10px;
}
.catbg2 , tr.catbg2 td
{
background-image: url(images/catbg2.jpg);
background-color: #E9F0F6;
color: #000000;
padding-left: 10px;
padding-right: 10px;
}
.catbg, .catbg2, .catbg3
{
border-bottom: solid 1px #E9F0F6;
background-repeat: repeat-x;
}
.catbg, .catbg2
{
font-weight: bold;
}
.catbg3, tr.catbg3 td, .catbg3 a:link, .catbg3 a:visited
{
font-size: 95%;
color: white;
text-decoration: none;
}
.catbg a:link, .catbg a:visited , .catbg2 a:link, .catbg2 a:visited
{
color: white;
text-decoration: none;
}
.catbg a:hover, .catbg2 a:hover, .catbg3 a:hover
{
color: #e0e0ff;
}
/* This is used for tables that have a grid/border background color (such as the topic listing.) */
.bordercolor
{
background-color: #ADADAD;
padding: 0px;
}

/* This is used on tables that should just have a border around them. */
.tborder
{
padding: 1px;
border: 1px solid #ADADAD;
background-color: #fafafa;
}

/* Default font sizes: small (8pt), normal (10pt), and large (14pt). */
.smalltext
{
font-size: x-small;
font-family: verdana, sans-serif;
}
.middletext
{
font-size: 90%;
}
.normaltext
{
font-size: small;
}
.largetext
{
font-size: large;
}


/* Posts and personal messages displayed throughout the forum. */
.post, .personalmessage
{
width: 100%;
overflow: auto;
line-height: 1.3em;
}

/* All the signatures used in the forum.  If your forum users use Mozilla, Opera, or Safari, you might add max-height here ;). */
.signature
{
width: 100%;
overflow: auto;
padding-bottom: 3px;
line-height: 1.3em;
}

/* Sometimes there will be an error when you post */
.error{
color: red;
}


/* definitions for the main tab, active means the tab reflects which page is displayed */
.maintab_first, .maintab_back, .maintab_last, .maintab_active_first, .maintab_active_back, .maintab_active_last
{
background-position: left bottom;
color: white;
text-transform: uppercase;
vertical-align: top;

}
.maintab_back, .maintab_active_back
{
color: white;
text-decoration: none;
font-size:  9px;
vertical-align: top;
padding: 2px 6px 6px 6px;
font-family: tahoma, sans-serif;
}

.maintab_first
{
background-image: url(images/maintab_first.gif);
background-repeat: no-repeat;
width: 10px;
}
.maintab_back
{
background-image: url(images/maintab_back.gif);
background-repeat: repeat-x;
}
.maintab_last
{
background-image: url(images/maintab_last.gif);
background-repeat: no-repeat;
width: 8px;
}
.maintab_active_first
{
background-image: url(images/maintab_active_first.gif);
background-repeat: no-repeat;
width: 6px;
}
.maintab_active_back
{
background-image: url(images/maintab_active_back.gif);
background-repeat: repeat-x;
}
.maintab_active_last
{
background-image: url(images/maintab_active_last.gif);
background-repeat: no-repeat;
width: 8px;
}

/* how links behave in main tab. */
.maintab_back a:link , .maintab_back a:visited, .maintab_active_back a:link , .maintab_active_back a:visited
{
color: white;
text-decoration: none;
}

.maintab_back a:hover, .maintab_active_back a:hover
{
color: #0ec4d8;
text-decoration: none;
}
/* definitions for the mirror tab */
.mirrortab_first, .mirrortab_back, .mirrortab_last, .mirrortab_active_first, .mirrortab_active_back, .mirrortab_active_last
{
background-position: left top;
color: white;
text-transform: uppercase;
vertical-align: top;

}
.mirrortab_back, .mirrortab_active_back
{
color: white;
text-decoration: none;
font-size: 9px;
vertical-align: bottom;
padding: 6px 6px 2px 6px;
font-family: tahoma, sans-serif;
}

.mirrortab_first
{
background-image: url(images/mirrortab_first.gif);
background-repeat: no-repeat;
width: 10px;
}
.mirrortab_back
{
background-image: url(images/mirrortab_back.gif);
background-repeat: repeat-x;
}
.mirrortab_last
{
background-image: url(images/mirrortab_last.gif);
background-repeat: no-repeat;
width: 6px;
}
.mirrortab_active_first
{
background-image: url(images/mirrortab_active_first.gif);
background-repeat: no-repeat;
width: 6px;
}
.mirrortab_active_back
{
background-image: url(images/mirrortab_active_back.gif);
background-repeat: repeat-x;
}
.mirrortab_active_last
{
background-image: url(images/mirrortab_active_last.gif);
background-repeat: no-repeat;
width: 8px;
}

/* how links behave in mirror tab. */
.mirrortab_back a:link , .mirrortab_back a:visited, .mirrortab_active_back a:link , .mirrortab_active_back a:visited
{
color: white;
text-decoration: none;
}

.mirrortab_back a:hover, .mirrortab_active_back a:hover
{
color: #0ec4d8;
text-decoration: none;
}

Of ne beceriksiz insanım ben yaaa  :(  :(  :( 
« Last Edit: June 18, 2006, 11:59:15 AM by SenSatiOn »
ιƒ ι’м кιℓℓє∂ ву тнє qυєѕтισηѕ ℓιкє α ¢αη¢єя.. тнєη ι’ℓℓ вє вυяιє∂ ιη тнє ѕιℓєη¢є σƒ тнє αηѕωєя..

Offline T@LH@

  • Sr. Member
  • ****
  • Posts: 859
  • Risale-i Nur Forum
    • Nur Forum Nura Açılan Kapı
Re: Css Temel Terimleri
« Reply #10 on: June 21, 2006, 05:06:59 PM »
Peki arkadaslar ben bölüm acıklamalarını birascık uzun tutmak istiyom yani bir kısımı ana sayfada görünsün tamamıda bölümün üstüne geldiğinde ufak bir kutucuk acılıpı icinden gösterilsin bunu nasıl yapabilirim ?

Offline Arbalot

  • SMF Hero
  • ******
  • Posts: 3,635
  • Gender: Male
  • SMF Hastası
    • SMF Destek
Re: Css Temel Terimleri
« Reply #11 on: June 21, 2006, 05:47:32 PM »
bunun css ile pek bir alakası yok...
harzem yine iş cıktı sana...

Offline T@LH@

  • Sr. Member
  • ****
  • Posts: 859
  • Risale-i Nur Forum
    • Nur Forum Nura Açılan Kapı
Re: Css Temel Terimleri
« Reply #12 on: June 21, 2006, 06:13:42 PM »
bunun css ile pek bir alakası yok...
harzem yine iş cıktı sana...

Kusura bakma Arbalot cssde link işlemleri yapıldığı için burada sordum ... Ben o zaman yeni konu olarak acayım ...

Offline pr0xymAn1ac

  • Jr. Member
  • **
  • Posts: 256
  • Gender: Male
  • I said this in 2000s: HTML5 will RULE !
    • yunyeng on GitHub
Re: Css Temel Terimleri
« Reply #13 on: July 04, 2006, 07:35:40 AM »
beyler ben çöl ateşini kullanıyorum forumdaki tüm yazıların altı çizili ben hiç olmasın istiyorum style.css deki tüm underlineları sildim ama nafile sadece kategori isimleri deişti bölüm isimleri üyeler fln hepsi aynı

Offline {••тєηηιѕєя••}

  • Sr. Member
  • ****
  • Posts: 975
  • Gender: Male
  • Dünya Alem Burada..!
    • @aamixtt on Twitter
    • Dünya Alem ForumLarı
Re: Css Temel Terimleri
« Reply #14 on: July 04, 2006, 07:38:03 AM »
beyler ben çöl ateşini kullanıyorum forumdaki tüm yazıların altı çizili ben hiç olmasın istiyorum style.css deki tüm underlineları sildim ama nafile sadece kategori isimleri deişti bölüm isimleri üyeler fln hepsi aynı
Senin konuna yazdığım cevaba bi göz atarmısın..
underlineleri silmeyeceksin none yapacaksın oluyor.
Yaramın üstünde yürümeyi öğretti bana celladın bıçağı...
Yürümeyi, hem de yorulmadan yürümeyi...
Direnmeyi öğretti...
Direnmeyi..


• Dünya Alem Burada
• Elektronik ve Bilişim Dünyası



jackboot

  • Guest
Re: Css Temel Terimleri
« Reply #15 on: July 10, 2006, 02:36:45 PM »
çok faydalı olmuş... teşekkürler..

Offline esert

  • Semi-Newbie
  • *
  • Posts: 14
  • *Ya SeN Ya Son*
Re: Css Temel Terimleri
« Reply #16 on: July 14, 2006, 03:38:48 PM »
hay maşallah nazar değmesin arbolat gözünün yağına çift yumurta kırıyım ellerine salık


(ilk mesajıma böle güzel bi topic e yazmak benim için onur  verici :D)

Offline Gang$ta

  • Sr. Member
  • ****
  • Posts: 700
  • Gender: Male
  • Warez User : )
    • forum, sohbet, eğlence, download
Re: Css Temel Terimleri
« Reply #17 on: July 14, 2006, 03:53:33 PM »

resimde gosterdiğim yerlerin rengini değistirmek için tam olarak ne nereleri değistirmem lazım

Offline Arbalot

  • SMF Hero
  • ******
  • Posts: 3,635
  • Gender: Male
  • SMF Hastası
    • SMF Destek
Re: Css Temel Terimleri
« Reply #18 on: July 14, 2006, 03:57:42 PM »
1 . si için images klasorunde catbg leri arayacan ve bulup değiştirecen
2. için boardindex.template.php de
Code: [Select]
<td colspan="3" class="windowbg', !empty($settings['seperate_sticky_lock']) ? '3' : '', '">bunu bulup windowsbg olan yeri windowsbg21 yapacan ve style.css de yeni bi değişken tanımlayacan...

Offline Gang$ta

  • Sr. Member
  • ****
  • Posts: 700
  • Gender: Male
  • Warez User : )
    • forum, sohbet, eğlence, download
Re: Css Temel Terimleri
« Reply #19 on: July 14, 2006, 04:23:35 PM »
1 . si için images klasorunde catbg leri arayacan ve bulup değiştirecen
2. için boardindex.template.php de
Code: [Select]
<td colspan="3" class="windowbg', !empty($settings['seperate_sticky_lock']) ? '3' : '', '">bunu bulup windowsbg olan yeri windowsbg21 yapacan
buraya kadar tamamda "style.css de yeni bi değişken tanımlayacan..." kısmını anlamadım tam olarak onu nasıl yapıcam?