Sayfa numarası
CSS ile sayfa numarası eklemeyi öğrenirsin.
Sayfa numarası sayaçları
Yazdırırken her sayfanın numarasını göstermek için CSS sayaçlarından yararlanırsın. counter(page) ifadesi o an bulunan sayfanın numarasını verir. @page bildirimi içindeki bir kenar kutusunda content özelliğine yerleştirilir.
Örnek: @page { @bottom-center { content: counter(page); } }. Bu, her sayfanın alt ortasına numara yazar. @bottom-left, @top-right gibi başka kutular da vardır.
Sayfa numarası biçimleri
Sayfa numarasını başka biçimlerde de gösterebilirsin. counter(page, upper-roman) büyük Romen rakamlarıyla (I, II, III) yazar. counter(page, lower-alpha) harflerle (a, b, c) yazar.
İki sayacı yan yana da birleştirebilirsin: content: "Sayfa " counter(page). Böylece altta "Sayfa 1", "Sayfa 2" dizisi çıkar. İçeriği dilediğin gibi biçimlendirirsin.
Uygulama Sayfa numarasını alt ortaya koy
Bir @page bildirimi yaz. İçinde @bottom-center kutusu tanımla ve content: counter(page) bildirimi ekle. Aynı @page bloğunda margin: 2cm da tanımlansın.
Örnek çözümü göster
/* sayfa numarasını alt ortaya koy */
@page {
margin: 2cm;
@bottom-center {
content: counter(page);
}
}
Kendini test et
-
counter(page) ifadesi ne verir?
@page { @bottom-center { content: counter(page); } }- Toplam öğe sayısını
- Sayfa kenar boşluğunu
- Yazdırma tarihini
- Bulunan sayfanın numarasını
Cevabı göster
Bulunan sayfanın numarasını — Doğru. counter(page) o an bulunan sayfanın numarasını verir.
-
Sayfa numarasını alt ortaya koy
@page { @bottom-center { content: ____; } }Cevabı göster
@page { @bottom-center { content: counter(page); } } -
counter-reset: page ne yapar?
h1 { counter-reset: page; }- Sayacı sıfırdan başlatır
- Sayacı bir azaltır
- Sayacı tamamen siler
- Sayacı gizler
Cevabı göster
Sayacı sıfırdan başlatır — Doğru. counter-reset: page sayacı sıfırdan başlatır.
-
Her parçayı anlamına eşle
- counter(page)
- Sayfa numarası
- counter-reset
- Sayacı sıfırla
- @bottom-center
- Alt orta kutusu