imagens difusas na página da Web quando ampliadas

0

Eu tenho uma imagem que foi adicionada a uma página da web usando:

<img src="file:/C:/Documents and settings/administrator/desktop/A.bmp">

No entanto, quando eu zoom usando firefox, a imagem fica borrada - e isso é ruim, uma vez que a imagem tem detalhes que precisam ser claros. No Microsoft Paint, o zoom mantém a imagem nítida e clara, por isso existe alguma maneira de fazer isso, talvez com CSS ou algum método não dependente de navegador? Eu ouvi sobre o aliasing de imagens, mas não o entendo.

images webpage
fonte
Sua imagem é pixel art por acaso?
Vinayak
não é um gráfico orgonizacional, principalmente linhas pretas sobre um fundo branco.
Você pode postar a imagem?
Paul

Respostas:

0

Eu consegui encontrar uma solução, mas se alguém está usando um navegador estranho eu usei um número de seqüências CSS dependentes de navegador da seguinte forma:

<head>
<style>
img { 
image-rendering: optimizeSpeed;
    image-rendering: -moz-crisp-edges; /* Firefox */
    image-rendering: -o-crisp-edges; /* Opera */
    image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */
    image-rendering: optimize-contrast; /* CSS3 Proposed */
    -ms-interpolation-mode: nearest-neighbor; /* IE8+ */
}
</style>
</head>

Não sei se existe uma maneira melhor de funcionar para todos os navegadores.


fonte
0

Vejo que você obteve sua solução de uma resposta postada para essa pergunta de superusuário . Essa pergunta pede uma solução para a suavização de imagens que acontece quando você aplica zoom em uma imagem (imagem rasterizada), estendendo-a além das dimensões reais.

Isso está previsto para acontecer em qualquer navegador da Web e a razão pela qual isso parece não acontecer no Microsoft Paint é porque o Paint permite que você trabalhe com pixels individuais e eu acredito que ele usa o algoritmo de interpolação de vizinho mais próximo para dimensionar imagens rasterizadas enquanto você trabalha com elas .

A solução real para o seu problema é transformar sua imagem raster em um formato de gráficos vetoriais como o SVG e incluí-la em seu arquivo HTML .

Você pode fazer isso manualmente usando softwares de rastreamento como o Inkscape ou o Adobe Illustrator. Você também pode tentar a conversão automática com softwares como o Corel PowerTRACE ou o Vector Magic. Você pode ver os resultados do Vector Magic fazendo o upload de sua imagem para a ferramenta de rastreamento on-line .

Vinayak
fonte
mal tentar