CSS Ders-5 Çerçeve ( Border )
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-5 Çerçeve ( Border )

profil
cArleone
BEĞEN(0)
BEĞENME(0)
GÖRÜNTÜLENME(4216)
RAPOR ET
Css derslerine devam ediyoruz.Bu deste border kodlarını görecez.Öncelikle border ne işe yarar ordan başlayalım.border bir nesneye çerçeve vermemizi sağlar.
Şimdi kodlara geçelim
border:kalınlık sitil renk;

örnek olrak da
.buton{border:2px solid #000;}


Kalınlık ve rengi anlatmaya gerek yok zaten diğer derslerde baya değindim.
Stillere bakalım. En çok kullanılan 3 tane var.Bular :

solid=düz çizgi
dotted=noktalı
dashed:kutu kutu

yukarda solid verdik 4 tarafını 2 px kalınlığında siyah bir çizgi çevirecek.

Tek tarflı border vermek isteye biliriz. O zaman ne edecez diyosanız onun içinde kodlar var.

border-left //sol tarafa
border-right//sağ tarafa
border-top//üst tarafa
border-bottom//alt tarafa border vermek için


bunların kullanımıda yukardakiye aynı
border-top:kalınlık sitil renk;

tabi bu teklileri aynı objeye verip 2 veya 3 tarafınıda çevirme yapabiliriz.

Şimdi genel bir örnek ile işi daha iyi kavrayalım.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.kutu1{width:100px;height:100px;background:red;border:3px solid #666;}
.kutu2{width:100px;height:100px;background:blue;border-left:5px dotted green;border-bottom:2px dashed #000;}
</style>
</head>
<body>
<div class="kutu1"></div>
<div class="kutu2"></div>

</body>
</html>




emrhangms
emrhangms 4 Yıl Önce Cevaplandı
Eline sağlık çok yardımcı oldu.
AsametYıldırım
AsametYıldırım 2 Yıl Önce Cevaplandı
Bu benim ilk yorumum öncelikle size teşekkür etmek istiyorum hiçbir sitede olmayan olsa bile bile bu kadar sade ve anlaşılır anlatım yapan başka bir site yok Allah sizden razı olsun. Neyse soruma geçeyim css tasarım yaparken bu kutuları alt alt veya yan yana yerleştirerek mi başlayacağız?
cArleone
cArleone 2 Yıl Önce Cevaplandı
@AsametYıldırım evet sitenin iskeleti görünmez dikdörtgenlerden oluşturulup verileri içine ekleriz.



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