Mp3 Oynatıcı CSS Şablonları

Tamamen Yapılandırılabilir MP3 Çalar CSS Şablonları

MP3 çalar CSS şablonları ile ses kaydı değişmeden kalırken oynatıcı sitenizin renklerini, boyutlarını ve boşluklarını benimser. Nicepage, bu ayarların çoğunu Ses Öğesi'nin özelliklerinde ve Oynatıcı Stil Paneli'nde sunar; kapsanmayan durumlar için kendi kurallarınızı ekleyebilirsiniz.

Oynat Düğmesini ve İlerleme Çubuğunu Stillendirme

Bir oynatıcının stilleri birkaç ayrı alana ayrılır:

• Dolgu rengi, kenarlık ve gölgenin oynatıcıyı çevreleyen içerikten ayırdığı kapsayıcı.
• Rengi ve boyutu kapak görseli üzerinde net bir şekilde seçilmesi gereken oynat düğmesi.
• Farklı tonlarda doldurulmuş ve doldurulmamış bölümleri olan ilerleme çubuğu.
• Uzun bir ismin düğmeyi sıkıştırmaması için uygun boyutta ayarlanmış başlık ve sanatçı metni.

Hazır bir stil daha hassas bir düzenleme gerektirdiğinde, Custom CSS rehberi bir öğe sınıfının nasıl atanacağını ve öğe, sayfa veya site düzeyinde CSS'in nasıl ekleneceğini açıklar. Bir öğe kuralı özel bir oynatıcı için idealken, site kuralı tüm oynatıcıların birbiriyle uyumlu kalmasını sağlar. Nicepage özel CSS'i doğrudan düzenleyici içinde çalıştırmadığından, sonucu sayfa önizlemesinde kontrol edin. Parça başlamadan önce çubukta dolgu görünmez; bu nedenle arka planla bütünleşen bir dolgu rengi fark edilmeyebilir.

Dört Yaygın Varyasyonun Karşılaştırması

Kompakt bir oynatıcı düğmeyi, başlığı ve çubuğu tek bir dar satıra sığdırır. Başlığın alt satıra kaymasına izin vermek, her üçünü birden küçültmekten daha iyidir; çünkü metin çok küçülmeden çok önce düğmeye dokunmak zorlaşır. Koyu temalı bir oynatıcıda renkler bir bütün olarak çalışır; beyaz üzerinde iyi duran açık gri bir dolgu, antrasit üzerinde kaybolabilir. Minimal tasarımlar kenarlıkları ve gölgeleri kaldırır; bu yaklaşım düğme belirgin kaldığı sürece sorunsuz çalışır. Kapak odaklı oynatıcılar görseli ön plana çıkarır; ancak telefonda büyük bir görsel kontrolleri daracık bir alana sıkıştırabilir. CSS Grid veya Flexbox, ekran daraldığında kapağı kendi ayrı satırına taşıyabilir. Sabit piksel boyutları bir düğme veya küçük resim için uygundur, ancak oynatıcının tamamı için sabit bir genişlik belirlemek küçük ekranlarda genellikle düzeni bozar.

Tarayıcının Yerel Kontrollerinin Sınırları

Tarayıcıların yerel ses kontrolleri tarayıcıdan tarayıcıya farklı görünür ve çok az stil kuralına uyar; bu nedenle özel şekilli bir kaydırma çubuğu, ona özel tasarlanmış bir arayüz gerektirir. Yeniden stillendirilmiş bir oynat düğmesi oynatma ve duraklatma işlevini yine de oynatıcıya bırakır ve yeniden renklendirilmiş bir çubuk parçada sarma özelliği kazandırmaz. Odaklanma (focus) ve üzerine gelme (hover) stilleri yalnızca kontrolün bu durumları desteklediği yerlerde işe yarar; hiçbir CSS stili bulunmayan bir klavye desteğini sonradan ekleyemez. Özel bir kural Nicepage stilleriyle çakıştığında, sorunun kaynağını görmek için kuralı geçici olarak kaldırın. Panel ve birkaç özel kural oynatıcının önizlemede doğru görünmesini sağlıyorsa, şablon görevini başarıyla yerine getirmiş demektir.