Bir çok webmaster menu yada herhangi bir tablo oluştururken köşelerin rounded (yuvarlak) biçimli olmasını ister. Size önericeğim site, renkleri ve köşelerin özelliklerini belirttikten sonra hem köşe imajlarını hemde kullanacağınız css ve html kodlarını size veriyor sizede sadece kullanması kalıyor.

Yapmanız gereken şeyler ilk olarak Box Background (kutu arkaplan rengi) , Page Background (sayfa arkaplan reng) , Corner Radius (köşelerin yarıçap değeri) ve Köşelerin transparan yapısını belirtmek. Create Graphic (grafikleri oluştur) dediğinizde size 4 adet köşelerin gif resimlerini , css yapısını ve htmlde kullanıcağınız kod yapısını veriyor ve gerisi tamamen sizin kullanım şeklinize kalıyor. İşte sitemiz ;

http://wigflip.com/cornershop/

Konu başlığındada belirttiğim gibi siteniz yüklenirken imajlarınızda güzel bir şekilde yüklensin diye css de basit bir kod yapısı hazırladım. Kod yapısnın mantığı aslında imajların arkaplanında basit bir yükleniyor resmi eklemek doğal olarak imajlarınız açılıncaya kadar yükleniyor resmini görüceksiniz imajlarınız açılıncada yükleniyor resmi arkaplanda gözükmeyecek. Sitemdede kullandığım kod yapısı oldukça basit ve kullanışlı .. bu arada loader yani yükleniyor imajlarınıda ajaxload.info sitesinden temin edebilir kendi sitenize uygun loaderlar oluşturabilirsiniz. ufak birde ipucu veriyim loader imajı ne kadar küçük olursa okadar hoş olur nedeni transparan resim eklediğinizde loaderin görünme ihtimali var.

Buyrun kod yapısı :

img {
background-image: url(yukleniyor.gif);
background-repeat: no-repeat;
background-position: center center;
}

Bir çok web tasarımcısının bildiği open source web design (açık kaynaklı web tasarımı) sitesi hazır html ve css tasarımların bulunduğu ve ücretsiz indirim yapabiliceğiniz bir yer. Amaç daha çok örnekler ile kendinize uygun olan tasarımı çıkarmanız tabi genelde bu şekilde değilde tasarım indirilip olduğu gibi kullanılıyor. Kendi tasarımınızı oluşturabilmeniz için güzel bir kaynak.

OSWD.org

Menuler bir site tasarlarken nerdeyse en önemli kısmı oluşturur. Tasarım yaparken menuyu siteye değilde tam tersi siteyi menuye göre yaptığım zamanlarda olmuştur. Vericeğim sitede 37 farklı navigasyon teknikleri gösterimiş css yapısını inceleyip kendinize göre düzenlemeniz sizin ve sitenizin farklı görünümlere ulaşmasını ve kullanıcının göz zevkini yenilemenizi kolaylaştırıcaktır.

Siteyi incelemek için Burdan buyrun

1-İşte başlıyoruz önce cssmenu.html adında bir html dosyası oluşturalım. tek dosyada hem html hemde css kısmını ele alıcaz.
2-Menumüzü listeleme komutu olan <ul> komutunu kullanarak oluşturucağız işte menumuzun html kod yapısı:

<ul>
<li><a href="#">Css</a></li>
<li><a href="#">Flash</a></li>
<li><a href="#">ActionScript</a></li>
<li><a href="#">Javascript</a></li>
<li><a href="#">SQL Server </a></li>
<li><a href="#">PHP</a></li>
</ul>

Devamını Oku

12 adet css kodlama ve görsel açıdan iyi bir şekilde tasarlanmış web siteleri ;

Marius Roosendaal

Devamını Oku

Güzel Css siteleri vardır ama ne zaman nerde bulucağımızı bilemeyiz. Yazıda vericeğim siteler bir nevi css sitelerini barındıran link diyarları. Güzel css sitelerini incelemek isterseniz bu css showcase sitelerin yardımı olucaktır.

Devamını Oku