MinikUzman | Bilgisayarın En Derinliklerinden: Css Class ve Id

<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://saltun.net/wp-content/uploads/2013/10/css.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="117" src="http://saltun.net/wp-content/uploads/2013/10/css.jpg" width="200" /></a></div>
Merhaba,<br />
Şimdi Css'de çok önemli bir konuya değineceğiz. Bu konu class ve Id hakkında. Çok fazla kullanılırlar ve bu yüzden önemli. Hiç uzatmadan başlayalım.<br />
<h3>
Class</h3>
<div>
Class yapısı bir tür sınıfı oluşturmaya yarar. Yani bir sınıf oluşturup ad koyarsınız. Sonra özellikleri içine koyarsınız. Sonrada bu özelliklere uymasını istediğiniz kodu sınıfa koyarsınız. İşte bu class özelliği buna yarıyor. Örneğin bir class oluşturalım;<br />
<br />
.yazı {<br />
font: 12pt Arial, Verdana;<br />
color: black;<br />
text-aling: left<br />
}<br />
<br />
Burada "." ile başlayıp bir isim oluşturduğumuzu görüyorsunuz. "." ile başlayan isimler class oluşturduğumuz anlamındadır. Peki bu sınıfa bir kodu nasıl sokarız;<br />
<br />
<div class="yazı">MinikUzman</div><br />
<br />
Bunun yerine yine class"yazı" özelliğini kodlara koyarak kullanabiliriz.<br />
<h3>
ID</h3>
</div>
<div>
ID ise class'tan farklı olarak sadece bir koda verilebilir. Yani tek elementte kullanılır. Ve bir ID oluşturmak istiyorsan başına # getiririz. Örneğin;</div>
<div>
<br /></div>
<div>
#yazı {</div>
<div>
font: 12pt Arial, Verdana;<br />
color: black;<br />
text-aling: left<br />
}<br />
<br />
Burada gördüğünüz gibi bir ID oluşturmak için # işareti kullandık. Peki bunu bir element yani koda nasıl uygularız;<br />
<br />
<div id="yazı">MinikUzman</div><br />
<br />
Burada da tek fark olarak "ıd" özelliği kullandık. Ve diğer class gibi kodlarda da özellik olarak kullanabiliriz.<br />
<br />
Bu derslik bukadar ve bir sonraki derste Css hakkında bir kaç şey daha öğretip artık özellik anlatımlarına geçeceğiz. Kolay Gelsin. Çalışmayı Unutmayın.</div>
<div>
<br /></div>
<div>
<br /></div>
<div>
<br /></div>