Yayın - @media
Markanız için 300X300 alan.
CSS'in @media
işlevi belgenin nerede ve hangi koşullarda gösterileceğini belirlemede kullanılır.
Hatırlayacağınız gibi CSS yalnızca tarayıcılar için değil, kullanıcı ajanları içindir.
Belgeler: Tarayıcılarla (masa & diz -üstü bilgisayarlarla), yazıcılarla ya da projeksiyon, tablet, cep telefonu gibi aygıtlar için yayınlanabilir.
Sayfanız bilgisayar ekranında güzel görünebilir ancak çıktı alındığı zaman biraz daha farklı görünmesini isteyebilir ya da taşınabilir aygıtlar için bütünüyle yeni bir tasarım kullanmak isteyebilirsiniz.
@media
Yayın Türleri
Belgeleri yayınlarken kullunabileceğiniz @media
yayın türlerinden bazıları :
screen
- renkli bilgisayar ekranıpage
- sayfalamaprint
- çıktı sayfasıprojection
- projeksiyon ekranıall
- tüm yayın türleri (ön tanımlı)
@media screen{
p{color:#cCc;}
}
JavaScript ile @media
'ya CSSMediaRule
aracılığıyla erişilebilir.
Sayfalama - Çıktı
@page
çıktı alırken sayfalamada kullanılıyor.
İki taraflı çıktı almak istediğinizde, kitapları açtığınızda gördüğünüz soldaki ve sağdaki sayfalar gibi, sırasıyla @page:left
ve @page:right
kullanılır. Soldan ve sağdan bırakılan boşluklar böylece soldaki ve sağdaki sayfalar için ayrı ayrı uygulanabilir.
Belgeler yayınlanırken ekranlar için boyut birimi olarak px, em, %, rem kullanılırken çıktı alınacağı durumlarda: İnç(in), points(pt = 1/72 inç), santimetre (cm) ya da milimetre (mm) kullanılır.
page-break-before
özelliği (-den önce sayfa biter), page-break-after
özelliği (-den sonra sayfa biter) ve page-break-inside
özelliği ile sayfanın sınırları belirlenir.
Kullanıcı Arayüzü
- Ö
:hover
- Üzerinde fare duran öğe. - Fare ile seçicinin üzerine gidin.
- -
- Odaklanılmış (klavye (ya da fare) ile o an odaklanılmış) olan öğe. - İkinci tuşun üzerine fare ile gidip fareyi tuştan uzaklaştırın.
- Ö
:active
- Seçime maruz kalan öğe. - Seçiciye fare ile tıklayın.
- Ö
:link
- Bir URL'ye bağlantı olan, ancak henüz kullanılmamış öğe.
- Ö
:visited
- Bir URL'ye bağlantı olan ve daha önce kullanılmış olan öğe.
inherit
Sözcüğü- Ata etiketin değerini geçerli kılar.
initial
Sözcüğü- Özelliğin öntanımlı değerini geçerli kılar.
:visited
, "özel gezinti modu"'ndayken ziyaret edilmiş sayfalarla ya da daha önce ziyaret edilen bağlantılar kayıt altına alınmıyorsa, işe yaramayacaktır.
İmleç - cursor
CSS Yazımı: cursor:değer;
default
- Öntanımlı - Fare ile değerin üzerine gidin.
pointer
- Bağlantı - Fare ile değerin üzerine gidin.
progress
- İşlem - Fare ile değerin üzerine gidin.
wait
- Bekle - Fare ile değerin üzerine gidin.
inherit
Sözcüğü- Ata etiketin değerini geçerli kılar.
initial
Sözcüğü- Özelliğin öntanımlı değerini geçerli kılar.
CSS Daha Yeni Başladı !
Önemli başlıkların sonuna geldik. Ancak hepsi doğal olarak bu değil.
Anasayfada size gösterilen dersler bitmiş olsa da devamı var. Örnekler var.
Tüm bunlardan sonra margin, padding, background, background-color, text-decoration, text-align, width, height, font-size, line-height, border, border-radius, box-shadow, text-shadow, transform, transition, animation, gradient, clear, top, left, right, bottom, opacity, word-spacing gibi en sık kullanılan CSS özellikleri; kısaltmaları, yazım kuralları, tarayıcı uyumluluklarıyla birlikte verilecek.
İşin temeli bu yukarıdakilerdir. Bilmek zorundasınız.
Seçiciler şu ana kadar gösterilenlerle sınırlı değil. Çok daha fazlası var!
Her zaman her yerde gereksinim duymayacak olsanız da yığınla CSS özelliği var. Yani doğal olarak, önünüzde hala dudaklarınızı uçuklatacak bir CSS referansı var. Tüm CSS özellikleri !
Eskileri, yenileri, geliştirilme aşamasında olanlar ya da deneysel olarak kullanımda olanlar. Yani HEPSİ sizi bekliyor !!!
Bir sonraki sayfayla CSS, tüm hızıyla devam ediyor.