CSS Ders-9 İnline ve Block Elementler
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

CSS Ders-9 İnline ve Block Elementler

profil
cArleone
BEĞEN(1)
BEĞENME(0)
GÖRÜNTÜLENME(2550)
RAPOR ET
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.



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol