Comentário: No entanto, depois que o CSS3 apareceu, a situação repetida de exibição foi aprimorada. A propriedade de tamanho de fundo pode tornar nossa esperança anterior de esticar e preencher a imagem de fundo. O método de uso específico é o seguinte. Amigos interessados podem se referir a ele. Espero que seja útil para todos.
Como fazer o preenchimento da imagem do fundo, essa pergunta parece simples. Mas lamento dizer a você. Não é tão simples quanto pensamos.Por exemplo, defina um plano de fundo em um recipiente (corpo, div, span). O valor do comprimento e da largura desse plano de fundo não pode ser modificado antes do CSS2.1.
Portanto, o resultado real é que ele só pode ser exibido repetidamente; portanto, as propriedades como repetição, repetição-x, repetição-y e sem repetição aparecem. É usado para controlar a exibição de imagens em segundo plano. Portanto, existem dois tipos de imagens de fundo:
1. É uma imagem totalmente grande, o tamanho e o tamanho da área, basta corresponder
2. Um gráfico de barras muito pequeno, depois de passar pela repetição, forma um fundo de imagem grande muito comum.
No entanto, depois que o CSS3 apareceu, essa situação foi melhorada. A propriedade de tamanho de fundo pode realizar nossas esperanças anteriores.
E essa propriedade pode ser usada no Firefox, Chrome e IE9.
O método de uso específico é o seguinte:
Tamanho da imagem de fundo (representação numérica):
#Background-Size {
Antecedentes-tamanho: 200px 100px;
}
Tamanho da imagem em segundo plano (representação percentual):
#Background-Size2 {
tamanho de fundo: 30% 60%;
}
Tamanho da imagem de fundo (equivalente a estender a imagem para preencher o elemento, ou seja, valor da capa):
#Background-Size3 {
Size de fundo: capa;
}
Tamanho da imagem de fundo (reduza a imagem em uma proporção igual para se adaptar ao tamanho do elemento, ou seja, contém valor):
#background-size4 {
tamanho de fundo: conter;
}
Tamanho da imagem de fundo (preenche elementos com o tamanho da própria imagem, ou seja, valor automático):
#Background-Size5 {
Size de fundo: Auto;
}