> [Site index](https://perfectvector.com/llms.txt) — available pages and descriptions. # SVG tarayıcıda basılmıyor mu? Baskı düzenini kontrol edin > Ekranda görünen SVG'nin tarayıcı baskısında neden kaybolduğunu bulun. Çizimi değiştirmeden baskı CSS'sini, arka plan ayarlarını ve gerçek PDF'yi test edin. Source: https://perfectvector.com/tr/blog/svg-not-printing-browser Language: tr Author: Irene Kim Published: 2026-10-15T08:00:00+09:00 SVG ekranda görünüyor ancak web sayfasını basarken kayboluyorsa önce sayfanın baskı CSS'sini ve grafiğin CSS arka planı olup olmadığını kontrol edin. Aynı SVG görüntü öğesi olarak korunurken baskı kuralı satır içi kopyayı gizleyebilir veya arka plan ayarı dekoratif kopyayı atlayabilir. Çizimi yeniden oluşturmak iki nedeni de düzeltmez. Sayfanın ve SVG'sinin kopyasında çalışın. HTML ve stillere, amaçlanan tarayıcının baskı ayarlarına ve kaydedilmiş PDF veya baskı önizlemesine erişim gerekir. Siteyi düzenleyemiyorsanız sahibine gönderilecek yararlı kanıtlar sayfa URL'si, tarayıcı sürümü, eksik grafik ve arka planları açmanın sonucu değiştirip değiştirmediğidir. ## Baskı hatasını boş SVG'den ayırın Önce çizimin normal sayfada göründüğünü doğrulayın. Kaynak orada da boşsa [boş SVG tanılamasıyla](https://perfectvector.com/tr/blog/svg-opens-blank) başlayın. Bu kılavuz eksik geometriyi, boyamayı, kesmeyi ve görüntü alanı sorunlarını ele alır. Ekrandan baskıya geçiş hatasında sayfanın grafiği nasıl yerleştirdiğini belirleyin: | Bulduğunuz şey | Sonraki kontrol | | ---------------------------- | ---------------------------------------------------------------------- | | Sayfada satır içi `` | SVG'nin, şekillerinin ve üst öğelerinin baskı kuralları | | `` | Görüntü yüklenmesi, görüntü öğesinin baskı stilleri ve yerleşim kutusu | | `background-image: url(...)` | Öğenin baskı stilleriyle birlikte arka plan baskı ayarları | | Çizim var ama kesiliyor | Basılan boyutlar, kapsayıcı kesmesi ve sayfa yerleşimi | Bunlar farklı vektör kalitesi türleri değil, ayrı render yollarıdır. [Satır içi SVG ve img kılavuzu](https://perfectvector.com/tr/blog/inline-svg-vs-img), her biçimde hangi sayfa stillerinin çizime ulaşabileceğini açıklar. **Kavramsal çizim** ![Ekrandaki üç yaprak amblemini baskı kontrolü sırasında kâğıt sayfadaki eksik veya görünür amblemlerle karşılaştıran çizim.](https://perfectvector.com/blog/svg-not-printing-browser/screen-to-print-visibility.webp) *Çizim: Ekran görünürlüğü ile basılı çıktı, baskı CSS'si ve arka plan ayarları nedeniyle farklı olabilir. Aşağıdaki ölçülmüş tarayıcı örneği ayrı özgün dosyalar kullanır.* ## Baskı sırasında kullanılan kuralı inceleyin Baskı stil sayfası veya `@media print` bloğu sayfayı kâğıt veya PDF çıktısı için değiştirebilir. [MDN'nin baskı kılavuzu](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Media_queries/Printing) iki yaklaşımı da belgeler ve CSS seçici özgüllüğünün yine geçerli olduğunu belirtir. Tarayıcınız bu seçeneği sağlıyorsa geliştirici araçlarında baskı medyasını taklit ederek grafiği inceleyin. Eşleşen kurallara ve hesaplanmış `display`, `visibility`, `opacity`, boyutlar ve boyamaya bakın. Kapsayan öğeleri de inceleyin: [display: none alt öğeleri renderdan kaldırır](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/display). Alt SVG'yi `display: block` yapmak gizli kalan üst öğeyi geri getirmez. Değiştirmeden önce çıktıyı değiştiren kuralı kaydedin. Baskı stil sayfası gezinme simgelerini kasıtlı kaldırırken belge logosunu yanlışlıkla eşleştirebilir. Seçiciyi daraltın veya etkilenen bileşenin baskı kuralını değiştirin. Gizli her öğeyi açan genel geçersiz kılmadan kaçının. Baskı medyası taklidi CSS davranışını bulmaya yardımcı olur. Gerçek dışa aktarılan PDF'yi açmanın yerini tutmaz. ## Aynı özgün SVG ile iki nedeni yeniden üretin Bu küçük örnek çizimi sabit tutup iki bağımsız kontrolü değiştirir: Yalnızca baskıya özgü görünürlük kuralı ve arka plan baskısı. Bu özgün işareti `mark.svg` olarak kaydedin: ```xml ``` Aşağıdaki eksiksiz sayfayı aynı klasöre `broken.html` olarak kaydedin. Satır içi kopya aynı daire ve üçgeni içerir. Görüntü ve arka planın ikisi de `mark.svg` yükler. ```html SVG print check

SVG print check

The same original SVG in three placements.

Inline SVG
Image element
Original geometric mark
CSS background
``` Sayfayı yerel önizleme sunucusu üzerinden açın. Python 3 kuruluysa iki dosyayı içeren klasörden, kullanılabilir bağlantı noktasıyla şu komutu çalıştırın: ```bash python3 -m http.server 8000 --bind 127.0.0.1 ``` `http://127.0.0.1:8000/broken.html` adresini açın. Üç işaret de ekranda görünmelidir. Tarayıcının baskı önizlemesini açıp arka plan grafikleri kapalı PDF, ardından açık PDF kaydedin. Ayarın adı ve yeri tarayıcıya bağlıdır. Ardından sayfayı `fixed.html` olarak kopyalayın. Yalnızca şu kuralı değiştirin: ```css @media print { .inline svg { display: block; } } ``` Düzeltilmiş sayfayı yeniden yükleyip iki PDF çıktısını tekrarlayın. Değişiklik örnekteki kasıtlı `display: none` ayarını tersine çevirir. Gerçek sayfada bileşenin amaçlanan baskı yerleşimine göre hatalı kuralı kaldırın veya daraltın. ### Gerçek PDF çıktıları ne gösterdi? Dosyaları Playwright 1.56.1 ile başsız Chromium 141.0.7390.37'de çalıştırdık. Yerel görüntünün yüklenmesini bekledik, dört tek sayfalı A4 PDF dışa aktardık ve incelemek için Poppler ile render ettik. İki ekran görüntüsü de üç işareti gösterdi. | Kaynak | Arka plan baskısı | Satır içi SVG | Görüntü öğesi | CSS arka planı | | ------------- | ----------------- | ------------- | ------------- | -------------- | | `broken.html` | Kapalı | Eksik | Görünür | Eksik | | `broken.html` | Açık | Eksik | Görünür | Görünür | | `fixed.html` | Kapalı | Görünür | Görünür | Eksik | | `fixed.html` | Açık | Görünür | Görünür | Görünür | Çıktılar baskı medyası, ölçek 1, sayfanın CSS kâğıt boyutu ve üst/alt bilgi olmadan oluşturuldu. Playwright'ın `printBackground` ayarını `false` ile `true` arasında değiştirdik; [PDF belgeleri](https://playwright.dev/docs/api/class-page#page-pdf) seçeneği ve varsayılan baskı medyası davranışını açıklar. İki dosyada da `print-color-adjust` yoktur. Arka planları açmak arka plan kopyasını geri getirdi, ancak gizli satır içi SVG'yi getirmedi. Baskı kuralını düzeltmek satır içi SVG'yi geri getirdi, ancak arka plan baskısını açmadı. Kaynak çizim hiç değişmedi. Bu test, belirtilen Chromium ortamı ve basit özgün geometri için bu sonuçları kanıtlar. Her tarayıcıda aynı davranışı, fiziksel yazıcı çıktısını veya kesin renk eşleşmesini kanıtlamaz. ## Nedeni düzeltip kaydedilmiş dosyayı kontrol edin **Baskı kuralı çizimi gizliyorsa:** Sorunun başladığı öğe veya üst öğedeki kuralı düzeltin. Belge onarımının arayüz kontrollerini yanlışlıkla açmaması için hem ekran hem baskı görünümünü yeniden test edin. **Yalnızca CSS arka planı eksikse:** Arka plan baskısı açık çıktıyla karşılaştırın. Grafik temel içerikse yalnızca dekoratif arka plana güvenmek yerine baskı düzeninde anlamlı görüntü veya satır içi SVG olarak yerleştirmeyi düşünün. Kontrollü örnekte görüntü öğesi arka planlar kapalıyken görünür kaldı; sayfanız yine kendi kontrolünü gerektirir. **Görüntünün kendisi yüklenmiyorsa:** Yollarını değiştirmeden önce istenen URL'yi ve kaynak hatalarını kontrol edin. [MDN, görüntü olarak kullanılan SVG'nin kısıtlamalarını belgeler](https://developer.mozilla.org/en-US/docs/Web/SVG/Guides/SVG_as_an_image); betik ve dış kaynak sınırlamaları da buna dâhildir. Bağımsız SVG sekmesi ile sayfaya gömülmüş görüntü eşdeğer bağımlılık testleri değildir. Sunucuda oluşturulan WeasyPrint çıktısı için ayrı [SVG kaynak çözümleme kılavuzunu](https://perfectvector.com/tr/blog/weasyprint-svg-image-pdf) kullanın. **Sonuç kesiliyor veya kısmen eksikse:** Sayfayı hatalı grafik ve kapsayıcısına indirin. Basılı kutularını, taşmayı ve SVG sınırlarını karşılaştırın, ardından geometri kontrolleri için mevcut boş SVG kılavuzuna dönün. Arka plan anahtarını kesme için genel onarım olarak kullanmayın. Her değişiklikten sonra yeni kaydedilmiş PDF'yi yeniden açıp grafiği amaçlanan boyutta inceleyin. Yakın içeriği, sayfa sonlarını ve anlamlı etiketleri kontrol edin. Tarayıcı sürümünü ve ilgili dışa aktarma ayarlarını kaydedin. PDF dosyasının diskte bulunması, çizimin içinde olduğunun kanıtı değildir. ## Vektörleştirmeyi yalnızca ayrı kaynak sorunu için kullanın Kullanılabilir yollu mevcut SVG, sayfayı düzeltirken yollarını korumalıdır. Tek kaynak raster küçük resimse ve düzenlenebilir şekiller gerekiyorsa [PerfectVector ile küçük resmi SVG'ye dönüştürün](https://perfectvector.com/tr/clipart-to-svg). Önizlemeyi inceleyin, ardından SVG düzenleme ve dışa aktarma için sonucun kilidini açın. Gömmeden önce silueti, delikleri ve küçük ayrıntıları rasterla karşılaştırın. PerfectVector çevredeki baskı stil sayfasını onarmaz veya tarayıcının arka plan ayarını seçmez. Herhangi bir çizim varlığını değiştirdikten sonra aynı sayfadan PDF'ye testi tekrarlayın. Amaçlanan ayarlarda gerekli çizim kaydedilmiş çıktıda görünür ve kesilmemiş olduğunda bitirin. Raster çizimden düzenlenebilir şekiller de kurtarmanız gerekiyorsa [PerfectVector ile SVG'yi hazırlayın](https://perfectvector.com/tr/clipart-to-svg), ardından son sayfada doğrulayın. Teslim edilecek şey kâğıt çıktıysa fiziksel prova kullanın; bu örnek yalnızca dijital PDF'leri test etti. ## Sık sorulan sorular **print-color-adjust: exact SVG arka planımın basılmasını garanti eder mi?** Hayır. Tarayıcıdan amaçlanan görünümü korumasını ister, ancak kullanıcı seçenekleri bunu geçersiz kılabilir. [MDN'nin print-color-adjust başvurusu](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/print-color-adjust) bu sınırları açıkça belirtir. Öğeyi gizleyen display kuralını da geri almaz. **Baskıyı düzeltmek için SVG'yi PNG'ye dönüştürmeli miyim?** Önce nedeni belirleyin. Dosya biçimini değiştirmek baskı medyası kuralını kaldırmaz veya arka plan baskısını açmaz. Sayfa ve çıktı ayarlarını kontrol ederken kullanılabilir SVG geometrisini koruyun. **Satır içi sürüm basılmazken görüntü sürümü neden basılıyor?** Sayfa farklı seçiciler uyguluyor olabilir. Kontrollü örnekte yalnızca baskıya özgü kural satır içi SVG'yi gizlerken görüntü öğesi görünür kalır. Tek gömme yönteminin her zaman daha iyi basıldığını varsaymak yerine gerçek kuralları inceleyin. ## Kaynaklar 1. [MDN: Baskı](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Media_queries/Printing) — Baskı stil sayfalarını, baskı medyasını ve devam eden CSS kaskadını açıklar. 2. [MDN: display](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/display) — Görünüm baskılanmasının öğe ve alt öğelerine etkisini tanımlar. 3. [Playwright: page.pdf](https://playwright.dev/docs/api/class-page#page-pdf) — Gerçek testin baskı medyası ve arka plan dışa aktarma kontrollerini belgeler. 4. [MDN: Görüntü olarak SVG](https://developer.mozilla.org/en-US/docs/Web/SVG/Guides/SVG_as_an_image) — Görüntü gömmeyi bağımsız SVG belgesinden ayıran kısıtlamaları anlatır. 5. [MDN: print-color-adjust](https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/print-color-adjust) — Görünüm taleplerini ve kullanıcı baskı tercihlerinin önceliğini açıklar. ## Explore - [Read the HTML article](https://perfectvector.com/tr/blog/svg-not-printing-browser) - [SVG'den Canvas'a: PNG Çıktısından Önce Çizimi Yükleyin](https://perfectvector.com/tr/blog/svg-canvas-image-export.md) - [SVG.js: Çizim Alın, Yolu Düzenleyin, SVG Dışa Aktarın](https://perfectvector.com/tr/blog/svgjs-import-export-artwork.md) - [Product facts](https://perfectvector.com/product-facts.md) - [FAQ](https://perfectvector.com/faq.md) - [Pricing and credits](https://perfectvector.com/pricing.md)