2010-09-13 13 views
10

Baskıda çapraz tarayıcı uyumluluğuna nasıl sahip oluyorsunuz? Tüm tarayıcıdan aynı kağıda baskı yapmak için baskı css dosyası için herhangi bir ipucu.Tüm tarayıcılarda sayfadaki Yazdır iletişiminde çapraz tarayıcı uyumluluğu nasıl sağlanır?

Düzenleme Zaten Eric Meyer CSS kullanarak ama biz sitesinden baskı alırken hala farklı bir tarayıcıda tutarsızlıkları karşı karşıyayım

.

media=screen'da iyi çalışan diğer css sıfırlamaları gibi, her zaman kullanabileceğimiz ve baskı css'de bir üst noktaya yerleştirebileceğimiz herhangi bir CSS bildirimi var mı? Zaten daha iyi olurdu media="print"


ile baskı (print.css) için farklı css kullanıyorum

daima baskı css içinde * {posotion:static}, *{float:none}, * {clear:both} tutmak için?

cevap

17

Aynı sonuçlar imkansızdır. Çıktı sadece CSS'ye değil, aynı zamanda sayfa kenar boşlukları, yazıcının yetenekleri, kullanılabilir yazı tipleri, kağıt formatı (A4 ve ABD Mektupları) ve muhtemelen daha fazlası için bireysel ayarlara da bağlıdır. CSS için

  • yüzen ve konumlandırma (nispi, mutlak ve sabit) kaçının. Özellikle Mozilla (Firefox) bu özellikleri çok iyi idare edemiyor.
  • page-break-* kullanın, ancak ona güvenmeyin. Bazı tarayıcılar, görüntülerde bile sayfa sonları ekler.
  • Sayfa genişliği ve yüksekliğini bilmiyorsunuz (A5 olabilir). Her şeyi olabildiğince esnek tutun.
  • For performance, baskı stilinizi @media print {} kuralı ile ana stil sayfasının içine yerleştirin.
  • Kenarlıklar ve kenar boşlukları için px kullanın. Bir yazıcı bir pikselin ne olduğunu bilmiyor ve garip sonuçlara yol açabilir.
  • @media print için en iyi desteği olan Opera'da baskı düzeninizi geliştirin ve işiniz bittiğinde uyumluluk kesmeleri ekleyin.
  • Internet Explorer, reserved IDs kullanırsanız, yazdırmada çökebilir.
  • Hiçbir zaman baskı önizlemesine güvenmeyin. Gerçek çıktılarda çok farklı sonuçlar elde edersiniz. Bir baskı-pdf-sürücü ile yağmur ormanı kaydedin. :)
+0

Tüm ipuçları için teşekkürler. Sorumu doğru anlamak için +1 –

2

Html'de "yazdırma" olarak ayarlanmış "media" özelliğine sahip bir bağlantı kullanılır.

<LINK rel="stylesheet" type"text/css" href="print.css" media="print"> 

Diğer tüm css'yi devre dışı bırakabilir ve "yazdırma" css'ini kullanabilirsiniz. Medyayı önce "ekran" olarak ayarlayın. Tüm tarayıcılarda normal bir css'yi test ettiğiniz gibi test edin.

Yaptığım deneyimde, ekranda ne göründüğü, yazdırıldığında oldukça fazla görünecektir.

Önerileri: o ayarlı ne hiç kağıt marjı esnek olabilmesi için

1) mümkün olduğunca sıvı olarak düzeni tutun. 2) basit tutunuz.

3) IE'de arka planlar eksik olabilir. Bunu düzeltmek için şu adrese gidin: Araçlar> İnternet Seçenekleri> Gelişmiş. Ayarlar kutusunda aşağı kaydırın ve "Yazdır arka plan renkleri ve resimleri"

+0

Cevabınız için teşekkürler. Baskı css ve 'media =" print "ı biliyorum, sorum farklıydı. hatta ana css CSS sıfırlama kullanıyorum ama baskı –

+0

tutarsızlıklara karşı karşıyayım Peki, bu farklı tarayıcılar ile uğraştığından beri yaygındır. Gerekirse, her biri için düzeltmeler oluşturmanız gerekir. – sheeks06

İlgili konular