CSS derslerimize devam ediyoruz.Bu ders önemli çünkü objelerin türlerine bakacaz.Bunu iyi kavramalısınız.CSS de 2 çeşit element var biri inline diğeri block.
1-Block
Block elementler uzaya bildiği kadar giden objeler.Yani block bir elementin yanına başka objeyi direk korsak alt satıra atacaktır.Bu block elementleri ard arda sıralamak için float kullanacaz.Bir sonraki derste onu anlatacaz.
Bir örnek yapalım.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.kutu{width:100px;height:100px;background:red;}
</style>
</head>
<body>
<div class="kutu"></div>
<div class="kutu"></div>
</body>
</html>
Burda width 100 px olmasına rağmen alt satıra attı.Çünkü div block element.
2-İnline
İnline width ve height i objeninkine eşleştiren ve yanına diğer inline elemanları koyabiliriz.Yani bir a tagı oluşturduk içine ne yazarsak uzunluğu otomatik olacaktır.yanına bir a tagı daha koyabiliriz.Tabi yer varsa.Örnek yapalım.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
a,span{background:red;}
</style>
</head>
<body>
<a href="#">cArleone</a> <span>cArleone</span>
</body>
</html>
Burda span ve a inline elemanlardır.
NOT:Bir elemanın inline mi block mu olduğunu anlamak için ondan 2 tane koyun yan yanaysa inline değilse block tur.
UstaDerslik
