Artigo Introdução de wulin.com (www.vevb.com): Prós e contras do CSS Sprites.
Prós e contras de sprites CSS
Em relação a essa tecnologia, os maiores benefícios são os seguintes:
1. Reduza o número de solicitações HTTP quando a página da web carregar. Essa situação parece se aplicar apenas aos casos em que os recursos precisam ser re-acomodados do lado do servidor, como o carregamento inicial. Mas não importa o quê, ainda é muito útil para uma página da Web com tráfego alto ou recarga frequente.
2. Ao criar uma imagem de fundo para o link, ela pode impedir a trêmula de fundo causada pelo carregamento da imagem de fundo quando A: Passe o mouse. Pessoalmente, acho que isso é de algum significado para melhorar a experiência do usuário.
3. As fotos são fáceis de gerenciar. A premissa é que as imagens da costura têm certas regras. Como mostrado na figura abaixo, é uma imagem do fundo do botão usado por todos os sites. Isso permite que você veja todos os estilos de botão no site intuitivamente. (Pessoalmente, gosto de soletrar fotos de acordo com certos atributos da imagem. Uma imagem é um ícone ou um fundo BTN ... chamado.
CSS Sprites Escopo de aplicação:
1. A aceleração da página da web precisa ser concluída reduzindo o número de solicitações HTTP.
2. A página da web contém um grande número de ícones pequenos. Ou, alguns ícones são muito versáteis.
3. Há fotos que precisam ser pré -carregadas na página da web. Está principalmente relacionado a A e A: Passeio de fundo. Se as imagens de plano de fundo de A e A: o mouse forem carregadas separadamente, o mouse do usuário se moverá para um botão e o plano de fundo do botão desaparecerá repentinamente e depois aparecerá, causando um flash. Se a cor do texto do botão for igual ou semelhante ao plano de fundo, será ainda mais embaraçoso, o que pode fazer com que as pessoas sintam que o botão desapareceu.
Condições a serem atendidas
Nas páginas da web, é melhor ter uma regra para imagens que são montadas nessa tecnologia. Defina largura ou altura. É melhor definir a largura e a altura. As imagens que requerem azulejos obviamente não são adequadas para o sprite.
Como mostrado na figura acima, os botões são determinados pela situação de largura e altura fixa.
No caso de largura fixa, várias figuras pequenas podem ser organizadas em paralelo. Quando a altura é definida, as pequenas imagens são organizadas verticalmente.
Se o plano de fundo não for fixo nem altura fixa, é fácil usar a tecnologia CSS Sprites no caso de largura fixa nem altura fixa, é fácil produzir o status de imagens que não devem aparecer na página. Se a altura estiver definida à força, será muito desfavorável para manutenção futura.
Resumir
Se essa tecnologia é boa ou ruim não pode ser generalizada. Depende da situação específica do site. Ao analisar, primeiro decida se você precisa ou não, e também integram de maneira abrangente os custos de desenvolvimento, custos de manutenção e outros problemas. Encontre um plano que se adapte à situação real antes de tomar uma decisão. Use sprites a tempo e é recomendável não colocar fotos de vários tamanhos, alinhamentos e usos de maneiras extremas para mantê -las. Tais extremos podem não reduzir o número de solicitações HTTP, mas, em vez disso, apresenta perigos ocultos para manutenção futura.