CSS (Cascading Style Sheets), biçimlendirme dilinde yazılmış bir belgenin sunumunu açıklamak için kullanılan bir stil sayfası dilidir. Web sayfalarının düzenini, yazı tiplerini, renkleri ve diğer görsel özelliklerini kontrol etmek için kullanılır.
CSS veya Basamaklı Stil Sayfaları, web sayfalarını biçimlendirmek ve biçimlendirmek için kullanılan bir kodlama dilidir. Web tasarımcılarının, sayfadaki boyutları, renkleri ve konumları dahil olmak üzere bir web sitesindeki metin, resim ve diğer öğelerin görünümünü kontrol etmelerini sağlar. Daha basit bir ifadeyle CSS, web sitelerinin güzel ve düzenli görünmesini sağlar.
CSS veya Basamaklı Stil Sayfaları, HTML veya XML'de yazılmış bir belgenin sunumunu tanımlamak için kullanılan bir programlama dilidir. CSS, HTML ile birlikte bir web sitesinin stilini tanımlamak için kullanılır ve web sayfanızdaki belirli öğelere veya öğe gruplarına uygulanması gereken stil gruplarını belirterek kuralları tanımlamanıza izin veren kural tabanlı bir dildir.
CSS, birden fazla web sayfasının düzenini aynı anda kontrol edebilen güçlü bir araçtır ve çok fazla iş tasarrufu sağlar. Güzel ve işlevsel web siteleri oluşturmak için metin renklerini, kutuları ve diğer öğeleri değiştirebilir. CSS, öğelerin ekranda, kağıtta, konuşmada veya diğer ortamlarda nasıl işlenmesi gerektiğini açıklayarak onu web geliştirmenin önemli bir parçası haline getirir.
İster yeni başlayan ister deneyimli bir web geliştiricisi olun, görsel olarak çekici ve kullanıcı dostu bir web sitesi oluşturmak için CSS'yi anlamak çok önemlidir. Bu yazıda, CSS'nin ne olduğunu, nasıl çalıştığını ve farklı CSS türlerini daha derinlemesine inceleyeceğiz. Hem işlevsel hem de görsel olarak çekici olan çarpıcı web siteleri oluşturmak için CSS kullanmanın en iyi uygulamalarından bazılarını da keşfedeceğiz.
CSS nedir?
CSS veya Basamaklı Stil Sayfaları, HTML veya XML'de yazılmış bir belgenin sunumunu tanımlamak için kullanılan bir programlama dilidir. HTML öğelerini biçimlendirmek ve birden çok web sayfasının düzenini aynı anda kontrol etmek için kullanılır.
Tanım
CSS, öğelerin ekranda, kağıtta, konuşmada veya diğer ortamlarda nasıl işlenmesi gerektiğine ilişkin kuralları tanımlayan kural tabanlı bir dildir. Geliştiricilerin bir web sayfasının sunumunu içeriğinden ayırmasına olanak tanıyarak web sitesinin bakımını ve güncellenmesini kolaylaştırır.
Tarihçe
CSS ilk olarak 1996'da tanıtıldı ve o zamandan beri birkaç güncelleme ve revizyondan geçti. Stil ve düzen açısından HTML'nin sınırlamalarını ele almak için geliştirilmiştir. CSS'den önce HTML, bir web sayfasının yapısını ve sunumunu tanımlamak için kullanılıyordu. Ancak bu, bir web sitesinin düzeninde veya tasarımında değişiklik yapmayı zorlaştırdı.
Önem
CSS, geliştiricilerin görsel olarak çekici ve duyarlı web siteleri oluşturmasına izin verdiği için web geliştirmede çok önemli bir rol oynar. Bir web sitesinin sunumu üzerinde daha fazla kontrol sağlar ve geliştiricilerin birden çok web sayfasında tutarlı bir görünüm ve his oluşturmasına olanak tanır.
Sonuç olarak, CSS, web geliştiricilerinin görsel olarak çekici ve duyarlı web siteleri oluşturmaları için gerekli bir araçtır. Bir web sitesinin sunumunu içeriğinden ayırır ve geliştiricilerin birden çok web sayfasında tutarlı bir görünüm ve his oluşturmasına olanak tanır.
CSS ile İlgili Temel Bilgiler
CSS, bir web sayfasının düzenini biçimlendirmek için kullanılabilen güçlü bir stil dilidir. Bu bölümde, sözdizimi, seçiciler, özellikler ve değerler dahil olmak üzere CSS'nin bazı temel kavramlarını ele alacağız.
Sözdizimi
CSS, HTML öğelerinin bir web sayfasında nasıl görüntülenmesi gerektiğini belirlemek için bir dizi kural kullanan kural tabanlı bir dildir. Bir CSS kuralı, bir seçici ve bir bildirim bloğundan oluşur. Seçici, biçimlendirilecek HTML öğesine işaret ederken, bildirim bloğu noktalı virgüllerle ayrılmış bir veya daha fazla bildirim içerir. Her bildirim, iki nokta üst üste ile ayrılmış bir CSS özellik adı ve bir değer içerir.
seçiciler
Seçiciler, bir web sayfasındaki belirli HTML öğelerini hedeflemek için kullanılır. Öğe seçiciler, sınıf seçiciler, kimlik seçiciler ve öznitelik seçiciler dahil olmak üzere birkaç seçici türü vardır. Öğe seçiciler, belirli HTML öğelerini hedeflerken, sınıf seçiciler, belirli bir sınıf özelliğine sahip öğeleri hedefler. Kimlik seçiciler, belirli bir kimlik özelliğine sahip öğeleri hedeflerken, nitelik seçiciler, belirli bir niteliğe sahip öğeleri hedefler.
Emlaklar
CSS özellikleri, bir web sayfasındaki HTML öğelerinin görsel görünümünü kontrol etmek için kullanılır. Renk, yazı tipi boyutu, arka plan rengi ve kenar boşluğu gibi birçok CSS özelliği mevcuttur. CSS özellikleri, bir öğenin nasıl görüntüleneceğini kontrol etmek için renk veya yazı tipi boyutu gibi belirli değerlere ayarlanabilir.
Değerler
Değerler, CSS özelliklerinin belirli değerlerini ayarlamak için kullanılır. Örneğin, color özelliği kırmızı, yeşil veya mavi gibi belirli bir renk değerine ayarlanabilir. Font-size gibi diğer özellikler, 12px veya 16px gibi belirli değerlere ayarlanabilir.
Kurallar ve Öncelik
CSS kuralları, bir web sayfasındaki belirli HTML öğelerinin stilini ayarlamak için kullanılır. Aynı öğeye birden fazla kural uygulandığında, en yüksek özgüllüğe sahip ve en son uygulanan kural öncelikli olacaktır. Bazı durumlarda, diğer kuralları geçersiz kılmak ve belirli bir stilin uygulanmasını sağlamak için !important anahtar sözcüğünün kullanılması gerekebilir.
Sonuç olarak CSS, bir web sayfasının düzenini biçimlendirmek için kullanılabilecek güçlü bir biçimlendirme dilidir. CSS sözdiziminin, seçicilerin, özelliklerin ve değerlerin temellerini anlayarak, gezinmesi kolay ve görsel olarak çekici olan güzel ve duyarlı web sayfaları oluşturabilirsiniz.
CSS Sürümleri
CSS, web geliştiricilerinin değişen ihtiyaçlarını karşılamak için yeni sürümlerin piyasaya sürülmesiyle yıllar içinde gelişti. Şu anda, CSS'nin dört ana sürümü vardır: CSS1, CSS2.1, CSS3 ve CSS4.
CSS1
CSS1, 1996'da yayınlanan ilk CSS sürümüydü. Yazı tipi rengi, boyutu ve stili gibi temel stil seçenekleri sağlıyordu. Ayrıca, bir sayfadaki öğelerin konumunu belirleyerek basit mizanpajların oluşturulmasına izin verdi. CSS1, öğelerin görünümünü tanımlamak için HTML etiketlerini kullanmayı içeren önceki web sayfalarını biçimlendirme yöntemlerine göre önemli bir gelişmeydi.
CSS2.1
CSS2.1, 1998'de piyasaya sürüldü ve baskı ve ekran gibi ortam türleri için destek ve öğelerin görüntülenmesi gereken sırayı belirleme yeteneği dahil olmak üzere birçok yeni özellik ekledi. Ayrıca, geliştiricilerin bir sayfadaki belirli öğeleri hedeflemesine ve bunlara stiller uygulamasına izin veren seçiciler kavramını da tanıttı.
CSS3
CSS3, 1999'da tanıtıldı ve CSS'nin en son sürümüdür. Animasyonlar, geçişler ve degradeler için destek dahil olmak üzere çok çeşitli yeni özellikler ekledi. CSS3 ayrıca, daha az kodla daha karmaşık düzenlerin oluşturulmasına izin veren esnek kutu ve ızgara gibi yeni düzen seçeneklerini de tanıttı. CSS3 bugün hala yaygın olarak kullanılmaktadır ve modern web geliştirme için standart haline gelmiştir.
CSS4
CSS4 şu anda geliştirme aşamasındadır ve yakın gelecekte piyasaya sürülmesi beklenmektedir. Geliştiricilerin stil sayfaları boyunca değerleri tanımlamasına ve yeniden kullanmasına olanak tanıyan değişken desteği de dahil olmak üzere birçok yeni özellik sunacak. CSS4, geliştiricilerin yerleştirildikleri kabın boyutuna uyum sağlayan duyarlı tasarımlar oluşturmasına olanak tanıyan kapsayıcı sorguları gibi yeni düzen seçeneklerini de içerecektir.
Sonuç olarak CSS, web geliştiricilerinin değişen ihtiyaçlarını karşılamak için yeni sürümlerin piyasaya sürülmesiyle başlangıcından bu yana çok yol kat etti. Her sürüm, karmaşık düzenler ve stiller oluşturmayı kolaylaştıran yeni özellikler ve yetenekler ekledi. CSS4'ün ufukta görünmesiyle birlikte, web geliştirmenin geleceği, geliştiricilerin kullanabileceği daha da güçlü araçlar ve seçeneklerle parlak görünüyor.
CSS ve HTML
CSS ve HTML, web sayfaları oluşturmak için kullanılan iki ayrı dildir. HTML, bir web sayfasındaki içeriği yapılandırmak için kullanılan bir biçimlendirme dilidir, CSS ise içeriği biçimlendirmek ve biçimlendirmek için kullanılır. Bu bölümde, görsel olarak çekici web sayfaları oluşturmak için CSS ve HTML'nin birlikte nasıl çalıştığını keşfedeceğiz.
HTML Öğeleri
HTML öğeleri, bir web sayfasının yapı taşlarıdır. Bir web sayfasının yapısını ve içeriğini tanımlayan etiketlerdir. HTML öğeleri başlıklar, paragraflar, listeler, resimler ve daha fazlasını oluşturmak için kullanılabilir. Her HTML öğesinin, CSS kullanılarak biçimlendirilebilen kendi özellikleri vardır.
İşaretleme Dili
HTML, bir web sayfasının yapısını tanımlamak için etiketleri kullanan bir biçimlendirme dilidir. Etiketler, içeriği çevrelemek ve anlam vermek için kullanılır. Örneğin, <h1> etiketi üst düzey bir başlığı tanımlamak için kullanılırken, <p> etiketi bir paragrafı tanımlamak için kullanılır. HTML, karmaşık web sayfaları oluşturmak için kullanılabilen güçlü bir dildir.
Hızlı Linkler
Bağlantılar, herhangi bir web sayfasının önemli bir parçasıdır. Kullanıcıların sayfalar arasında gezinmesine ve harici kaynaklara erişmesine olanak tanır. Bağlantılar kullanılarak oluşturulur <a> etiketi ve CSS kullanılarak biçimlendirilebilir. Bağlantılar, bir web sayfasında yer imleri oluşturmak için de kullanılabilir ve kullanıcıların sayfanın belirli bölümlerine hızlı bir şekilde atlamasına olanak tanır.
Genel olarak, CSS ve HTML, görsel olarak çekici web sayfaları oluşturmak için birlikte çalışır. HTML, bir web sayfasının yapısını ve içeriğini tanımlarken, CSS bu içeriği biçimlendirmek ve biçimlendirmek için kullanılır. Web geliştiricileri, HTML ve CSS'yi birlikte kullanarak kullanımı ve gezinmesi kolay, güzel ve işlevsel web siteleri oluşturabilir.
CSS ve Web Tasarımı
CSS, web tasarımında çok önemli bir rol oynar. Geliştiricilerin web sayfalarının görsel görünümünü kontrol etmelerini ve birden çok sayfada tutarlılık sağlamalarını sağlar. Bu bölümde, CSS'nin düzen, tipografi, renk ve resimler dahil olmak üzere web tasarımının farklı yönlerini nasıl etkilediğini keşfedeceğiz.
Düzen
CSS, web geliştiricilerinin web sayfalarının düzenini kontrol etmesine olanak tanır. Geliştiriciler, CSS kullanarak bir web sayfasında farklı öğeleri konumlandırabilir, bu öğelerin boyutunu kontrol edebilir ve farklı cihazlarda tutarlı bir şekilde görüntülenmelerini sağlayabilir. CSS ayrıca geliştiricilerin farklı ekran boyutlarına uyum sağlayan duyarlı tasarımlar oluşturmasına olanak tanıyarak web sayfalarının tüm cihazlardan erişilebilir olmasını sağlar.
matbaacılık
CSS, geliştiricilere web sayfalarının tipografisini kontrol etmek için çok çeşitli seçenekler sunar. Geliştiriciler, CSS ile bir web sayfasındaki metnin yazı tipi ailesini, yazı tipi boyutunu, satır yüksekliğini ve harf aralığını kontrol edebilir. Ayrıca, bir web sayfasındaki farklı öğeler arasındaki metin hizalamasını ve boşlukları da kontrol edebilirler.
Renk
CSS, geliştiricilerin bir web sayfasında kullanılan renkleri kontrol etmelerini sağlar. Geliştiriciler, CSS ile bir web sayfasının arka plan rengini ayarlayabilir, metnin rengini değiştirebilir ve bir web sayfasındaki farklı öğelerin rengini kontrol edebilir. CSS ayrıca geliştiricilere degradeler ve diğer karmaşık renk efektleri oluşturma yeteneği sağlar.
Görüntüler
CSS, geliştiricilerin bir web sayfasındaki görüntülerin görüntülenmesini kontrol etmelerini sağlar. Geliştiriciler, CSS ile resimlerin boyutunu kontrol edebilir, bir web sayfasındaki resimlerin konumunu ayarlayabilir ve resimlerin opaklığını kontrol edebilir. CSS ayrıca geliştiricilere alt gölgeler ve kenarlıklar gibi karmaşık görüntü efektleri oluşturma yeteneği sağlar.
Sonuç olarak, CSS web tasarımı için vazgeçilmez bir araçtır. Geliştiricilerin bir web sayfasında kullanılan düzeni, tipografiyi, rengi ve resimleri kontrol etmesini sağlayarak web sayfalarının görsel açıdan çekici ve tüm cihazlardan erişilebilir olmasını sağlar.
CSS ve Web Geliştirme
CSS veya Basamaklı Stil Sayfaları, web geliştiricileri için önemli bir araçtır. Düzen, renkler, yazı tipleri ve daha fazlası dahil olmak üzere HTML ve XML belgelerinin sunumunu kontrol etmelerine olanak tanır.
Harici CSS
Harici CSS, bir web sitesi tarafından kullanılan tüm stilleri içeren ayrı bir dosyadır. Bu dosya, kullanılarak HTML belgesine bağlanır. etiket. Harici CSS, sunumu içerikten ayrı tutmanın harika bir yoludur ve web sitesinin bakımını ve güncellenmesini kolaylaştırır. Ayrıca, bir web sitesindeki birden çok sayfada tutarlılık sağlar.
Dahili CSS
Dahili CSS, HTML belgesinde kullanılarak tanımlanır. tag. It is useful when you want to apply styles to a single page or a specific section of a website. However, it can make the HTML document cluttered and harder to read.
Satır içi CSS
Satır içi CSS, stil özelliği kullanılarak HTML öğesi içinde tanımlanır. Belirli bir öğeye stiller uygulamak istediğinizde kullanışlıdır. Ancak, HTML belgesini karmaşık hale getirebilir ve okunmasını zorlaştırabilir. Büyük ölçekli stil için satır içi CSS kullanılması önerilmez.
Medya sorguları
Medya sorguları, cihazın ekran boyutuna göre farklı stiller uygulamak için kullanılır. Bu, bir web sitesinin duyarlı olmasına ve telefonlar, tabletler ve masaüstü bilgisayarlar gibi farklı cihazlara uyum sağlamasına olanak tanır. Medya sorguları, harici CSS dosyasında veya HTML belgesinde tanımlanabilir.
Sonuç olarak, CSS web geliştiricileri için vazgeçilmez bir araçtır. Sunum ve içeriğin ayrılmasına izin vererek bir web sitesinin bakımını ve güncellenmesini kolaylaştırır. Büyük ölçekli stil için harici CSS önerilirken, dahili ve satır içi CSS daha küçük ölçekli stil için kullanışlıdır. Medya sorguları, bir web sitesinin duyarlı olmasına ve farklı cihazlara uyum sağlamasına olanak tanır.
CSS Avantajları
CSS, web geliştiricilerinin görsel olarak çekici ve tutarlı web sayfaları oluşturmasını sağlayan güçlü bir araçtır. İşte CSS kullanmanın avantajlarından bazıları:
hız
CSS'nin ana avantajlarından biri hızıdır. CSS, geliştiricilerin bir web sayfasının tasarımını ve düzenini içeriğinden ayırmasına olanak tanır. Tarayıcının her sayfa için birden çok stil sayfası indirmesi gerekmediğinden, bu ayırma bir web sayfasının yükleme süresini önemli ölçüde azaltabilir. Bunun yerine tarayıcı, birden çok sayfada kullanılabilen stil sayfasını önbelleğe alır ve bu da daha hızlı sayfa yükleme süreleri sağlar.
Tutarlılık
CSS, geliştiricilerin birden çok web sayfasında tutarlı tasarımlar oluşturmasına yardımcı olur. Geliştiriciler, tek bir stil sayfası kullanarak bir web sitesindeki tüm sayfaların tutarlı bir görünüm ve hisse sahip olmasını sağlayabilir. Bu tutarlılık, kullanıcılar web sitesinde daha kolay gezinebilecekleri ve ihtiyaç duydukları bilgileri daha hızlı bulabilecekleri için kullanıcı deneyiminin iyileştirilmesine yardımcı olabilir.
Bakım
CSS, bir web sitesinin bakımını ve güncellenmesini kolaylaştırır. Geliştiriciler, bir web sitesinin tasarımını ve düzenini içeriğinden ayırarak, içeriği etkilemeden tasarımda değişiklikler yapabilir. Bu, bir web sitesinin tasarımında bir değişiklik yapılması gerekiyorsa, tüm web sitesini yeniden yazmak zorunda kalmadan hızlı ve kolay bir şekilde yapılabileceği anlamına gelir.
CSS ayrıca bir web sitesinin düzeninde değişiklik yapmayı kolaylaştırır. Geliştiriciler, CSS kullanarak bir web sayfasındaki birden çok öğeye uygulanabilecek yeniden kullanılabilir stiller oluşturabilir. Bu, bir web sayfasının düzeninde bir değişiklik yapılması gerekiyorsa, bunun CSS stil sayfasını güncelleyerek hızlı ve kolay bir şekilde yapılabileceği anlamına gelir.
Sonuç olarak, CSS, web geliştiricilerine birçok avantaj sunan güçlü bir araçtır. Geliştiriciler, CSS kullanarak hızlı yüklenen, bakımı ve güncellemesi kolay, görsel olarak çekici ve tutarlı web sayfaları oluşturabilirler.
CSS Referansları
CSS ile çalışırken, alışılmadık özellikler veya sözdizimi ile karşılaştığınızda başvurabileceğiniz güvenilir bir referansa sahip olmak çok önemlidir. Şans eseri, CSS'yi etkili bir şekilde anlamanıza ve kullanmanıza yardımcı olacak pek çok kaynak var.
W3C
World Wide Web Konsorsiyumu (W3C), CSS de dahil olmak üzere web standartlarını geliştirmekten ve sürdürmekten sorumlu birincil kuruluştur. Web siteleri, temel sözdiziminden gelişmiş düzen tekniklerine kadar dilin tüm yönlerini kapsayan kapsamlı bir CSS referansı sunar. Referans, özelliğe göre düzenlenmiştir ve her birinin nasıl kullanılacağına dair örnekler içerir.
Referansa ek olarak, W3C web sitesi ayrıca öğreticiler, teknik özellikler ve en iyi uygulamalar dahil olmak üzere CSS'yi öğrenmek ve kullanmak için çok sayıda başka kaynak sağlar. CSS'de uzmanlaşma konusunda ciddiyseniz, W3C web sitesi önemli bir kaynaktır.
Modüller
CSS modüler bir dildir, yani eksiksiz bir stil sayfası oluşturmak için birleştirilebilen ayrı modüllerden oluşur. Her modül, düzen, tipografi veya renk gibi belirli bir CSS alanına odaklanır. CSS'yi modüllere ayırarak anlamak ve etkili bir şekilde kullanmak daha kolaydır.
W3C web sitesi, tüm CSS modüllerinin bir listesini ve özelliklerine bağlantı sağlar. En önemli modüllerden bazıları şunlardır:
- CSS Seçicileri: Bir belgedeki öğeleri seçmek için sözdizimini tanımlar.
- CSS Kutu Modeli: Öğelerin bir sayfada nasıl düzenlendiğini açıklar.
- CSS Izgara Düzeni: Karmaşık düzenler oluşturmak için güçlü bir sistem sağlar.
- CSS Dönüşümleri: Öğelerin şeklini, boyutunu ve konumunu dönüştürmenize olanak tanır.
- CSS Animasyonları: CSS kullanarak animasyonlar ve geçişler oluşturmanıza olanak sağlar.
Çeşitli CSS modüllerini tanıyarak, daha yetkin bir CSS geliştiricisi olabilir ve daha gelişmiş ve sofistike tasarımlar oluşturabilirsiniz.
Sonuç olarak, güvenilir bir CSS referansına sahip olmak, CSS ile çalışan herhangi bir geliştirici için çok önemlidir. W3C web sitesi, CSS'de uzmanlaşmanıza yardımcı olmak için diğer birçok kaynakla birlikte kapsamlı bir referans sağlar. Ek olarak, çeşitli CSS modüllerini anlamak, daha gelişmiş ve sofistike tasarımlar oluşturmanıza yardımcı olabilir.
CSS Animasyonları
CSS Animasyonları, geliştiricilerin web sitelerinde dinamik ve ilgi çekici kullanıcı deneyimleri oluşturmalarına olanak tanıyan güçlü bir araçtır. Animasyonlar, bir sayfadaki belirli öğelere dikkat çekmek, kullanıcılara geri bildirim sağlamak veya yalnızca görsel ilgi eklemek için kullanılabilir.
Bir CSS animasyonu oluşturmak için önce canlandırmak istediğiniz öğeyi seçmeniz ve ardından CSS özelliklerini kullanarak animasyonu tanımlamanız gerekir. bu animation özelliği animasyonu tanımlamak için kullanılır ve animasyonun zamanlamasını, süresini ve diğer ayrıntılarını kontrol etmenize izin veren birkaç alt özelliği vardır.
Unutulmaması gereken önemli bir nokta, animasyonların yoğun kaynak tüketebileceğidir, bu nedenle onları idareli ve dikkatli kullanmak önemlidir. Animasyonlar, kullanıcı deneyimini azaltmamalı, geliştirmeli, bu nedenle onları kapsamlı bir şekilde test etmek ve web sitenizin genel performansını nasıl etkileyeceklerini düşünmek önemlidir.
Animasyon oluşturmak için kullanabileceğiniz bazı temel CSS özellikleri şunlardır:
animasyon adı
Bu özellik, bir öğeye uygulamak istediğiniz animasyonun adını tanımlar. Birden çok animasyon tanımlayabilir ve bunları sayfanızdaki farklı öğelere uygulayabilirsiniz.
animasyon süresi
Bu özellik, animasyonun tamamlanması için gereken süreyi tanımlar. Süreyi saniye veya milisaniye cinsinden belirtebilirsiniz.
animasyon-zamanlama-fonksiyonu
Bu özellik, animasyonun hızını kontrol etmek için kullanılacak zamanlama işlevini tanımlar. gibi kullanabileceğiniz birkaç önceden tanımlanmış zamanlama işlevi vardır. linear, ease-in, ve ease-outveya kendi özel zamanlama işlevlerinizi oluşturabilirsiniz.
animasyon gecikmesi
Bu özellik, animasyon başlamadan önce geçecek süreyi tanımlar. Bu, bir sayfada birden fazla animasyonun zamanlamasını kademelendirmek istiyorsanız yararlı olabilir.
animasyon yineleme sayısı
Bu özellik, animasyonun kaç kez tekrarlanacağını tanımlar. Belirli bir yineleme sayısı belirtebilir veya değeri kullanabilirsiniz. infinite süresiz olarak döngüye giren bir animasyon oluşturmak için.
animasyon yönü
Bu özellik, animasyonun oynayacağı yönü tanımlar. normal ileri animasyon için, reverse geriye dönük bir animasyon için veya alternate ileri ve geri animasyonlar arasında geçiş yapmak için.
animasyon doldurma modu
Bu özellik, canlandırılan öğenin stilinin animasyondan önce ve sonra nasıl olması gerektiğini tanımlar. belirtebilirsin none öğenin stilini değiştirmeden bırakmak için, forwards öğenin stilini animasyonun sonunda tutmak için veya backwards öğenin stilini animasyonun başında uygulamak için.
animasyon-oynatma-durumu
Bu özellik, animasyonun oynatılıp oynatılmadığını veya duraklatıldığını tanımlar. değeri kullanabilirsiniz paused animasyonu duraklatmak için veya running başlatmak veya devam ettirmek için
Sonuç olarak, CSS Animasyonları, web sitenizde dinamik ve ilgi çekici kullanıcı deneyimleri oluşturmak için kullanılabilecek güçlü bir araçtır. Ancak, yoğun kaynak tüketebilecekleri ve web sitenizin genel performansını etkileyebilecekleri için bunları idareli ve dikkatli kullanmak önemlidir. Animasyon oluşturmak için kullanılan temel CSS özelliklerini anlayarak, kullanıcı deneyimini geliştiren ve web sitenize görsel ilgi katan animasyonlar oluşturabilirsiniz.
Daha fazla Okuma
CSS (Cascading Style Sheets), HTML ve XML gibi biçimlendirme dillerinin sunumunu tanımlamak için kullanılan bir dildir. İçeriğin yazı tipini, rengini, boyutunu ve aralığını değiştirerek, birden çok sütuna bölerek veya animasyonlar ve diğer dekoratif özellikler ekleyerek web sayfalarını biçimlendirmek ve düzenlemek için kullanılır. CSS çok fazla iş tasarrufu sağlar ve aynı anda birden fazla web sayfasının düzenini kontrol edebilir. (kaynak: MDN Web Belgeleri, W3Schools)
İlgili Web Sitesi Geliştirme terimleri