Ana içeriğe geç
Web Geliştirme

Web sayfalarını kağıda basmak için CSS teknikleri paylaşıldı

Öne çıkanlar

  • @page kuralında margin değeri sıfırlanarak kenar boşluğu yönetimi doğrudan DOM öğelerine aktarılıyor.
  • Çok sayfalı belgelerde her sayfa için sabit boyutlu article etiketleri kullanılıyor.
  • Baskı sırasında gereksiz arayüz bileşenleri @media print sorgusuyla gizleniyor.

Web geliştiricisi voussoir, şirket içi form ve belgeleri tarayıcı üzerinden fiziksel kağıda hatasız aktarmak için kullandığı CSS yöntemlerini anlattı. Hazırlanan teknik kılavuzda, baskı çıktılarının ekran tasarımından farklı olarak katı fiziksel sınırlarla çalıştığı ve tarayıcı yazdırma kurallarının doğru kurgulanması gerektiği belirtildi.

Yazıda temel olarak @page at-kuralı, @media print sorguları ve DOM kutu modelinin yönetimi ele alındı. Sayfa kenar boşluklarının doğrudan @page içinde sıfırlanıp padding değeriyle sayfa öğelerine verilmesi önerildi; bu sayede çift kenar boşluğu hatalarının ve taşmaların önlendiği aktarıldı. Çok sayfalı belgelerde ise her sayfanın ayrı bir <article> etiketiyle temsil edilmesi tavsiye edildi.

Çok sayfalı tablolarda JavaScript desteğiyle otomatik sayfalama mekanizması kurulması gerektiği ifade edildi. URL parametreleri veya veri tabanı API çağrılarıyla beslenen belgelerin yazdırma öncesinde içerik düzenlemelerine de imkan tanıdığı kaydedildi.

Kaynak

Bu özet yapay zekâ ile hazırlanmıştır; ayrıntılar ve doğrulama için orijinal kaynağa başvurun.