‘CSS’ Kategorisi Arşivi:
Ul Li ile listeyi iki sütunda sıralama
Aşağıdaki koları kullanarak uzayıp giden ul ol listinizi ikiye yada geliştirerek daha fazla sütuna bölebilirsiniz.
<ul>
<li>abc</li>
<li>abc</li>
<li>abc</li>
<li>abc</li>
<li>abc</li>
<li>abc</li>
<li>abc</li>
<li>abc</li>
</ul>
- abc
- abc
- abc
- abc
- abc
- abc
- abc
- abc
Alttaki css stil kodlarıyla yukarıdaki listeyi 2 sütun yapabilirsiniz.
ul {
width: 50%;
float: left; padding-left: 0;
margin-left: 0;
}
li {
float: left;
width: 50%;
}
li:nth-child(odd) {
clear: left;
}
li {
float: left;
width: 50%;
}
li.first_col {
clear: left;
}
CSS Horizontal Vertical Açılır Menü Oluşturucu – Ul Ol Li
CSS bilginiz iyiyse kendinizde kolayca kodlayabilirsiniz fakat bilenler bilir karmaşık ve zor bir iştir. Bu işlemi hızlıca istediğiniz gibi oluşturabilmeniz için online hizmet veren bir site var. Bu site sayesinde bir çok adı bulunan bu görsel menüyü “CSS Horizontal Vertical Açılır Menü Oluşturucu – Ul Ol Li” süper bir şekilde oluşturabilirsiniz.
CSS ile seçili Alanları Renklendirme
Sitemizdeki gibi seçili alanları varsayılan mavi rengin haricinde bir renk olarak kullanmak istiyorsanız css dosyanıza alttaki kodları ekleyin. Kodlar firefox 2+ ve operada çalışmaktadır ve hımbıl internet explorer desteklememektedir.
::-moz-selection {
background:#c00;
color:#fff;
}
::selection {
background:#c00;
color:#fff;
}
Max-Width Max-Height ie6 çözüm
max-width ve max-height css kodları bilindiği üzere ie 6′nın desteklediği bir özellik değil.Ama bu demek olmuyor ki ie6 da bu özelliği kullanamayacağız.Aşağıdaki css kodları sayesinde tüm tarayıcılarda bu özelliği çok rahat kullanabilirsiniz.
max-width için ie6 uyumlu css kodu;
değiskeniniz { width: expression( document.body.clientWidth < 334 ? "333px" : "auto" ); /* ie için gerekli css kodu */ min-width: 333px; /* tüm diğer standart tarayıcılar için varsayılan kod */ } değiskeniniz { height: expression( this.scrollHeight > 332 ? "333px" : "auto" ); /* ie için gerekli css kodu */ max-height: 333px; /* tüm diğer standart tarayıcılar için varsayılan kod */ }
CSS ile Div Layerlar (tabaka – katman)
CSS diliyle aynen photoshoptaki gibi katmanlar oluşturup bunları istediğimiz gibi kulalabiliriz.CSS sana aşığım demeden kendimi alamıyorum çünkü bu dil cidden bir harika
hadi örneğimizi görelim
|
Kodumuzu görecek olursak ;
<div style="position: relative; font-size: 50px; z-index: 2;">katman 1</div>
<div style="position: relative; top: -50px; left: 5px; color: red; font-size: 80px; z-index: 1;">katman 2</div></td>
</tr>
Burada benim css kodlarıyla çakıştığı için bir türlü düzgün gösteremedim, ama size lazım olan kodlar yukarda istediğiniz gibi düzenleyebilirsiniz…..



