Web siteleri için, butonların özel bir yeri bulunmaktadır. Yani web sitenizde kullandığınız butonların, tasarımınıza özel olarak hazırlanmış olması, oldukça fark yaratıcı bir etki bırakacaktır. Bu yüzden özgün butonlar oluşturmak çok ama çok önemli. Photoshop kullanarak da bu işlemi yapabiliriz. Ancak CSS yardımı ile de birbirinden güzel butonlar oluşturmak mümkün. Bu yönde hazırlanmış birtakım web siteleri de mevcut durumda. Böylelikle birkaç tıklama ile, [...]

Bir web sitesinde yer alan görsellerin belli bir boyut doğrultusunda görüntülenmesi, özellikle profesyonel bir görünüm açısından oldukça önem arz etmektedir. Örneğin, web sitenizdeki görsellerin boyutlarını (yükseklik ve genişlik değerleri) belli bir oranda belirlemediniz. Bu durumda yapılabilecek, otomatik bir yöntem mevcut mu? Elbette, CSS yardımı ile otomatik fotoğraf boyutlandırmak kesinlikle mümkün. Böylelikle, web sitenizdeki tüm fotoğrafların boyutunu [...]

CSS ile ilgili dersleri içeren yazı dizimize devam ediyoruz. Geçtiğimiz derslerde hatırlarsanız, yazılara gölge verme ve kutulara gölge verme gibi içeriklerin yanı sıra, seçili alan rengini değiştirme ve yorum satırı ekleme gibi konuları da işlemiştik. Şimdi ise, harf dönüşümü konusunu inceliyor olacağız. Bu bağlamda, CSS ile kodlama yaparken, dilediğiniz metinlerin veya başlıkların, tamamen büyük ve tamamen küçük harflerden oluşmasını sağlayabiliyorsunuz. Buna [...]

Bildiğiniz gibi HTML sayfasına yazılan yazılar aynı hizada olur. Ancak daha farklı bir görünüm elde edebilmek adına, paragraf girintisi yapmayı düşünebilirsiniz. Yani CSS kullanılarak paragraf başlangıcında bir miktar boşluk bırakabilmek mümkün olup, böylelikle paragrafların daha sağlıklı bir görünüme kavuşmasını sağlayabilmektesiniz. Bu bağlamda, "text-indent" kodunu kullanarak bu isteğimizi kolaylıkla gerçekleştirebiliyoruz. Dilerseniz, hemen bir örnek [...]

CSS ile stil kodlamaları yaparken, düzenli olmak oldukça önem arz ediyor. Yani daha sonra ilgili kodları incelerken veya farklı düzenlemeler yaparken, ne işe yaradıklarını ve ne için o şekilde kodlandıklarını hatırlamak açısından da faydalı olabiliyor. Bu yüzden CSS kullanırken yorum (açıklama) satırları ekleyebiliyoruz. Açıklamaları da yalnızca aşağıdaki şekilde kaleme aldığımızda, web sitesine yansımayacak olup, yalnızca CSS dosyası [...]

CSS dersleri ile ilgili olan yazı dizimize ara vermeden devam ediyoruz. Bir önceki yazımızda da, CSS kullanarak yazılara gölge verme konusunu işlemiştik. Şimdi ise, içeriğe ait kutulara veya köşelere gölge efekti vermeyi öğreniyor olacağız. Böylelikle web sitenizde yer alan div elementlerine ait çerçevelere dilediğiniz gibi gölge verebileceksiniz. Dilerseniz şimdi, aşağıda yer alan örneği inceleyelim ve gölge efekti vermenin ne kadar kolay olduğunu [...]

Birçok web sitesi sahibi, şık ve özgün bir görünüm elde edebilmek adına, içeriklerinde yer alan yazılara gölge efekti uygulamayı tercih etmektedir. CSS ile "text-shadow" özelliğini kullanarak, oldukça kısa bir kod sayesinde bu işlemi kolaylıkla gerçekleştirebiliyoruz. Böylelikle ilgili metinlerdeki gölge rengini ve gölge derinliğini de dilediğiniz gibi ayarlayabilmektesiniz. Şimdi dilerseniz, aşağıdaki örnek kodu ve örneği inceleyerek, ilgili özelliğin nasıl kullanıldığını [...]

CSS ile web sitenizin tasarımının daha iyi ve özgün görünebilmesi adına yapılabilecek olan birçok püf noktası söz konusu. Örneğin artık, web sitenizdeki div elementlerine ait köşeleri Photoshop ile oval yapmanıza gerek yok. Yani CSS kullanarak da köşeleri yuvarlak bir hâle getirmek çok basit olup, böylelikle daha sağlıklı bir görünüm elde edebilmektesiniz. Aşağıda yer alan kodların tümünü kullanmanız durumunda; Google Chrome, Mozilla Firefox, Internet [...]