Ads Top

CSS ile Yuvarlak Köşe Oluşturma

Web 2.0 `ın hayatımıza girmesinden sonra, bazı tasarım trendleri de bu süreçte tasarımcıları etkiledi. Bunlardan birisi de yuvarlak köşeli tablolar oluşturmak. Daha önceden resim dosyalarıyla oluşturduğumuz yuvarlak köşeler oldukça zaman ve emek harcamamıza neden oluyordu. CSS3 ile birlikte yuvarlak köşeleri sadece CSS kodu ile oluşturmamız mümkün.

Oluşturacağımız kod birçok yaygın tarayıcı destekliyor ama İnternet Explorer`ı desteklemiyor malesef. Sanırım 2050 yıllarında İnternet Explorer CSS3 `ü destekleyecektir.

Aşağıdaki kodu yuvarlatmak istediğimiz köşemizin div kodunun içerisine eklemeniz yeterli.
Burada 5px değeri yuvarlatma derecesidir, bunu arttırabilir ya da azaltabilirsiniz. Tercih size kalmış.


Kodumuzun uygulanışı örneklersek;

Bütün kenarları aynı derecede yuvarlatmak için


Her köşeye ayrı değer vermek için


Daha Fazla Tarayıcı Sonuçları

Bu kodlarımızın daha farklı şekilde de kullanabiliriz, ayrıca bu kodların değişik tarayıcılarda ve değişik yollarla kullanıldığında ki sonuçlarını görmek için buradaki adresi ziyaret edebilir, daha detaylı bilgiye ulaşabilirsiniz.


2 yorum:

  1. Teşekkürler işime yaradı, ayrıca ie için 2050 kısa bir tarih sanırım 2100 daha iyi olurdu.

    YanıtlaSil

Blogger tarafından desteklenmektedir.