Temanın CSS Kodlarını Düzenlemek
Her BulutPress web sitesinin yönetim panelinde CSS kodlarını düzenleme sayfası bulunur. CSS kodları temanın nasıl görüneceğini belirleyen basit kod yapılarıdır.
Her temanın parametreleri farklı olabilir, ancak parametre başlığından o kodun nereyi değiştireceğini anlayabilirsiniz.
Örneğin: @ust-bar-zemin-rengi: adlı parametre, muhtemelen tasarımın üst kısmında menü grubununun bulunduğu yerdeki yazıların renklerine denk geliyor. Siz de deneme yanılma yoluyla hangi parametrenin nereye denk geldiğini kolayca anlayabilirsiniz.
Bu durumda sizin bilmeniz gereken tek şey ilgili parametreyi bulup
- Temanın Arkaplan Renklerini düzenlemek ve
- Temanın Arkaplan Resimlerini değiştirmektir.
Bir Web Sitesinin CSS Kodları Nasıl Düzenlenir?
CSS'yi nasıl öğrenirsiniz? CSS, bir sayfadaki ögelerin görüntülenmesini manipüle etmenin tüm farklı yönlerini ele almayı öğrenmek için birçok farklı katmana sahip geniş bir konudur. Konular, sıfırdan öğrenmeye uygun bir sırayla düzenlenmiştir. Bu nedenle, CSS'de yeniyseniz, en baştan başlayıp aşağı doğru ilerleyerek anlayışınızı kademeli olarak artırabilirsiniz.
Css Seçiciler
CSS'deki temel ilk kavramlardan biri, seçiciler ve nasıl çalıştıklarıdır. Oradan gelişmiş seçicilere ve sözde seçicilere geçebilir ve işleyebileceğiniz çeşitli özellik türlerini anlayabilirsiniz. Ancak seçiciler olmadan, öğrendiklerinizi uygulamanızın hiçbir yolu yoktur, bu yüzden başladığınız yer burasıdır.
Css Kutu Modeli
CSS'yi anlamanın ve sayfanızdaki ögeleri nasıl değiştireceğinizin temelinde CSS kutu modeli yatar. Bunu anlamazsanız, daha gelişmiş kavramlarla çok uzağa gidemezsiniz ve sürekli olarak CSS tarafından hüsrana uğrarsınız.
Css Düzeni
Web tasarım görünümünü düzenlemek için html ögelerini hedefleme yeteneğine sahip olduğunuzda, düzen, ustalaşmanız gereken bir sonraki temel kavramdır. Düzen, ögelerin sayfada nasıl düzenlendiğini değiştirmeyi içerir. Ne kadar yer kaplıyorlar? Yan yana mı yoksa üst üste mi? Tam olarak arzu ettiğiniz tasarımı yaratmak için bunu nasıl manipüle edersiniz? Bu, Flexbox ve CSS Grid ile son birkaç yılda önemli ölçüde değişen ve gelişen bir CSS alanıdır, ancak bazı temel ilkeler (akış ve kutu modeli) aynı kalmıştır.
Giderek artan bir şekilde mizanpajlar yalnızca CSS Grid ve Flexbox ile yapılabilir, ancak hala daha eski tarayıcıları desteklemesi gerekenler için, Flexbox veya hatta kayan ögeler kullanılarak oluşturulan ızgara sistemleri hala yararlıdır.
Css ile Metin Şekillendirme
Web stilinin temel parçalarından biri, metinle nasıl başa çıktığımızdır. Paragraflar, başlıklar, bağlantılar, listeler... metin, web'in temel yapı taşlarından biridir ve onu güzel göstermenin sayısız yolu vardır.
Css ile Kutu Şekillendirme
Nesnelerin web'de nasıl göründüğünün diğer temel yapı taşı kutulardır. Yukarıda kutu modelinde öğrendiğiniz gibi, bir web sayfasındaki her şey bir kutudur, dolayısıyla bu kutuları şekillendirmek için kullanabileceğiniz araçları anlamak çok önemlidir.
Css Birimleri
Bir şeyi boyutlandırmayı, konumlandırmayı veya gölgelendirmeyi içeren her şey birimleri içerir. Sayfamızdaki ögeleri ne kadar boyutlandırmak, konumlandırmak veya başka bir şekilde manipüle etmek istediğimiz konusunda açık olmalıyız . TBu bölüm, web geliştiricileri olarak bize sunulan tüm birimleri açıklamaktadır.
Css Renkleri ve Degradeleri
Web bir değil, 3 benzersiz renk sisteminin yanı sıra bir dizi anahtar kelimeye ve karmaşık gradyanlar oluşturma yeteneğine sahiptir.
Css Geçişleri Ve Animasyonlar
Geçişler ve animasyonlar, ögelerin bir stilden diğerine nasıl değiştiğini belirtmenize olanak tanır. Bu, üzerine gelindiğinde küçük bir mikro etkileşim kadar ince veya çok adımlı bir animasyon kadar karmaşık olabilir. Bunlar, web sitenize lezzet ve etkileşim eklemek için anahtardır. Durumlar arasında aniden geçiş yapmak sarsıcı olabilir, geçiş yapmak kullanıcının bilişsel yükünü azaltır ve her şeyin doğal hissettirmesini sağlar.
Css Dönüşümleri
CSS Dönüşümleri, ögelerinizi 2B veya 3B alanda kaydırmanıza ve dönüştürmenize olanak tanır. Basit dikdörtgen kutularla yetinmediniz ve üçgenler mi oluşturmak istiyorsunuz? Muhtemelen dönüşümleri kullanacaksınız. Ayrıca, ögeleri kendi katmanlarına taşıyarak ve animasyonları GPU ile hızlandırmanıza izin vererek, ögelerin bazı yönlerini yüksek performanslı bir şekilde canlandırmanıza olanak tanır. Çok kullanışlı!
Css Sözde Sınıfları ve Sözde Öğeler
Sözde sınıflar ve sözde ögeler, CSS becerilerinizin seviyesini yükseltmeye başladığınızda araç sandığınızdaki en kullanışlı araçlardan bazılarıdır. Sözde sınıflar, ögeleri durumlarına ve diğer ögelerle olan ilişkilerine göre hedeflemenize izin verirken, sözde ögeler ögelerinizin içinde yaşayan "örtük" ögelerdir ve size manipüle etmeniz için yeni hedefler verir.
Bu, bağlantılara veya düğmelere simgeler ekleme, ek kenarlıklar üzerinde katman oluşturma veya diğer karmaşık görsel hileler gibi şeyler yapmanıza izin verebilir.
Css @ Kuralları (Örn. Medya Sorguları)
CSS'deki hemen hemen her şey, bir tür seçici tarafından seçilen ögelere uygulanan özellikler olarak düşünülebilir, ancak birkaç istisna vardır. Sözde at-rules
(karakterle başlayan kurallar @
), bazı ek davranışlar uygulamanıza, karakter kümesi belirtme, harici kaynakları içe aktarma ve desteklenen özellik veya cihaz boyutu gibi şeylere dayalı CSS bloklarını belirleme gibi şeyler yapmanıza olanak tanır. Bu kurallar (özellikle medya sorguları), farklı düzenleyerek cihaz boyutuna "yanıt veren" sayfaların ve uygulamaların geliştirilmesi olan Duyarlı web geliştirmenin merkezinde yer alır.