Akışkan tipografi nedir? Akıcı tipografi ile, yazı tipi boyutlarınız için görüntü alanı birimlerini(cihazın ekran boyutu) tek başına veya bir calc()değerin parçası olarak kullanırsınız. Bu, ikisini dengede tutarak yazı tipi boyutunuzun ekranın boyutuyla birlikte büyümesini sağlayacaktır. Be bu da responsive tasarımda yazı/font boyutlarının da akıcı olmasını yani responsive typography/duyarlı tipografi kullanmanız anlamında gelir.
CSS medya sorguları CSS3’ün bir parçası olarak ortaya çıktı. Cihaza veya cihazın özelliklerine göre CSS’nizi değiştirmenize izin vermektedir. Sayfanızın görünümünü ekranınızın genişliğine göre ayarlamak için muhtemelen bunları zaten kullanıyorsunuz. Bununla birlikte, genellikle göz ardı edilen başka birçok fonksiyonu vardır.
Web sitesinde menü ve bağlantılar için animasyon aramaktan bıktınız ise bu koleksiyon sayesinde aramayı bırakabilirsiniz. 100’den fazla farklı animasyonun bir listesini buldunuz.
Bu yazımda HTML ve CSS kullanarak sayfa içerisindeki resmlerin üzerine gelindiğinde :hover olarak metin gösterilmesini paylaşacağım. Bu Google Görsel SEO için de iyi bir işlem.
HTML ve CSS kullanarak aç-kapa(toggle) buton oluşturmak o kadar da zor değil, nasıl yapılabileceğini paylaşıyorum.
Bir div’i veya herhangi bir(display:block; olan) elemanı yatay ve dikey olarak ortalamanın tüm yollarını paylaşacağım.
Hello World! Bugün sizlere Front End web developerların işine yarayacak, @DevLorenzo’nun hazırladığı Cheatsheet derelemesini paylaşacağım.
Web sayfalarında bazı nedenlerle bazı görseller gösterilemeyebilir, bu durumlarda sayfada resim yerine hiç güzel olmayan bir görüntü oluşur ve biz bu vereceğim CSS kodu ile onu yakışıklı hale getireceğiz.
Bir HTML web sitesi için slide show/slayt gösterisi deyince akla ilk gelen şey JavaScript oluyor ancak bir CSS kompetanı olarak ben eğer basitçe yalnızca görseller görünecek ise JavaScipt’e ihtiyaç duymuyorum.
Bir önceki yazımda CSS ile Scrollbars/kaydırma çubuğunun gizlenebilmesini göstermiştim, bu yazımda da sayfa içerisindeki bir bölümün kaydırma çubuğunu yalnızca üzerine gelinince(hover) gösterilmesini anlatacağım.
Bazen, bazı durumlarda sayfanın kaydırabilmesini ancak kaydırma çubuğunun görünmesini istemezsiniz(görünmez kaydırma çubuğu / overflow:hidden; değil) böyle durumlarda burada yazacağım CSS metodunu kullanabilirsiniz.
Sadece HTML ve CSS kullanarak animasyonlu bir paylaş butonu oluşturacağız. Basitçe, paylaşma butonu, kullanıcının sosyal medya aracılığıyla takipçilerine resim, video, müzik göndermesine yardımcı olan bir düğme anlamına gelir. Facebook, Twitter, Linkedin, YouTube ve diğerleri gibi herhangi bir sosyal medya olabilir. Günümüzde paylaşım düğmeleri, kullanıcının paylaşımını kolaylaştırmak için hemen her web sitesi ve mobil uygulamada kullanılmaktadır.
Son zamanlarda Teksas’da bile kar yağıyor, bu haftanın başıyla Marmara’da da güzel kar yağdı değerlendirmelere göre bugünden sonra artık yağmayacak. Bu yazımda HTML ve CSS ile(JavaScript olmadan) web sayfasına kar yağdırma efekti yapayı göstereceğim.
CSS karmaşık bir dil olmasa da, öğrenmeye başladığımda bazı kısımları benim için bir muammaydı. Örneğin, birden çok kutu gölgesi veya arka plan görüntüsü niteliğini birleştirmek. Bu yüzden bu oyun alanlarını(playgrounds) CSS ile çalışmayı daha kolay ve verimli hale getirmek için tasarlandı.
Geçen gün bu blog için yaptığım arşiv sayfasında sitedeki tüm başlıkları listelemiştim, aklıma arşiv sayfasına girenlerin sayfa içerisinde listelenmiş başlıklar içerisinde arama yapabilmesi fikri geldi ve hemen jQuery’ye sarıldım ve yaptım. Tabii ki paylaşıp bu deneyimi de arşivlemek istedim.