CSS Border ve Border Radius - Kenarlıklar
CSS' de oluşturduğunuz bir bölgeye kenarlık verebilirsiniz. Bunu yapmak için de border özelliğinden yararlanmalısınız. Border özelliğinden kısaca bahsedecek olursak, solid-dashed-dotted şekillerinden birine sahip ve kalınlığı olan, ayrıca kenarları kıvrılabilen-yuvarlaklaştırılabilen bir eleman.
Alttaki örnekte, yanyana verilmiş 3 tipte bulunan kenarlık örneğini inceleyebilirsiniz.
Kenarlık yapımı bu kadarla bitmiyor elbette ama ben yüzeysel olarak geçmek istiyorum.
Kenarlık yaparken örneğin üst kenarı yapıp alt kenarı yapmamak istemeyebilirsiniz. Bu durumda da CSS içinde bulunan border-left,border-right, border-top ve border-bottom kodlarından, yani her kenar için kodu özel olarak eklemek, yararlanabilirsiniz.
Kenarlık yaparken eğer kenarları kıvırmak isterseniz, bu da çok kolay. Ben genelde kod ile yazmak yerine verdiğimiz pixele göre kod oluşturan bir siteden oluşturup, kullanıyorum. Gerçekten kullanımı kolay.
Siteye buradan ulaşabilirsiniz.
Eğer kod ile border-radius yazmak isterseniz de şu örneği vereyim :
Buradan anlayacağınız gibi, border-radius ile kenarları yuvarlaklaştırdık. -webkit- ve -moz- ibarelerini görebilirsiniz, bunlar farklı tarayıcılarda kodun işlevselliği açısından gereklidir.
Hiç yorum yok
Yorum Gönder