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 [...]

Bildiğiniz gibi herhangi bir web sitesinde seçili bir alanın rengi standart olup, tüm web sitelerinde de aynıdır. Ancak CSS kullanarak seçili alan rengi değiştirebilmek mümkün. Böylelikle, web sitenizin mevcut tasarımına uygun bir şekilde seçili alan rengini güncelleyebilirsiniz. Aşağıdaki örneği direkt olarak kullanabileceğiniz gibi, seçilen alanın arka plân rengini ve seçili alana ait yazı rengini değiştirebilirsiniz. Tercih size ait. Ayrıca, iki kod olmasının sebebi ise, özelliğin [...]

CSS ile ilgili birtakım püf noktaları paylaşmaya devam ediyoruz. Geçtiğimiz günlerde, bir "div elementi"ni sol üst köşeye nasıl sabitleyeceğime dair birtakım kodlar deniyordum ve sizlerin de zaman zaman bu yönde ihtiyaçları olabileceği aklıma geldi. Dolayısı ile CSS yardımı ile elementleri dilediğimiz gibi konumlandırabiliriz. Böylelikle, ilgili elementler bizlerin belirlediği konumda sabit olarak bulunmaya devam eder. Birkaç örneğe göz atalım ve konuyu daha iyi [...]

Bazı web sitelerindeki görsel veya bağlantı metinlerinde yer alan, kenarlıkları görmüş olmalısınız. Yani herhangi bir resimde yer alan çerçevelerden veya bir bağlantıya tıklandığı zaman ortaya çıkan kenarlıklardan bahsediyoruz. Daha temiz bir görünüm elde etmek için, bu gibi kenarlıklardan CSS yardımı ile tamamen kurtulabilirsiniz. Açıkçası, mevcut border etiketleri için daha farklı kalınlık ve renk değerleri belirleyerek, bu kenarlıkları ilgi çekici kılabilmek [...]

Web sitenize eklemiş olduğunuz bazı nesnelerin, görüntülenmesini istemediğiniz zamanlar olabilir. Örnek olarak, eklediğiniz bir kodun çalışmasını ancak sayfa üzerinde yer kaplamamasını arzu edebilirsiniz. İlgili işlem, CSS yardımı ile kolaylıkla yapılabilmektedir. Oldukça kısa bir CSS kodunu kullanmanız durumunda, ilgili element var olmaya devam eder ancak sayfa üzerinde hiçbir şekilde görüntülenmez ve herhangi bir boşluk da söz konusu olmaz. Dilerseniz, küçük [...]

Bir web sitesi hazırlarken, özellikle içerik kısmını özenle hazırlamakta fayda bulunmaktadır. Ayrıca içeriğin, ziyaretçinin ilgisini çekebilmesi adına birçok SEO bazında aksiyon alınmasının da önemi oldukça büyük. Bu bağlamda, içeriğinizde dikkat çekmek istediğiniz bölümlerin altını çizili bir hâle getirebilmektesiniz. Bu işlemi CSS ile oldukça kolay bir şekilde gerçekleştirebiliriz. İlgili işlemi hem salt HTML ile hem de CSS yardımı ile yapabiliyoruz. Yönergeleri incelemeniz [...]

CSS sayesinde oldukça kısa kodlar ile birçok şeyi gerçekleştirebiliyoruz. Özellikle başlıklarda kullanmaya özen gösterdiğim bir kod hakkında konuşmak istiyorum. Satırlar arasındaki yüksekliği belirleyebildiğimiz ve daha sağlıklı bir görünüm elde edebilmek adına kullandığımız bu kod, "line-height" olarak dile getirilebilmektedir. Basit olarak, belirttiğim gibi satırlar arasındaki mevcut yükseklik [...]