Background

[LeoO_DF 22]

estou começando um Site e estou com algumas dúvidas em como usar suas imagens, eu estou usando elas com div, usando background e background position, mais a partir de uma resolução pequena em que a imagem e a div se extende ficando maior ela perde qualidade e a imagem fica maior que o tamanho indicada fazendo com ela ela acabe ficando maior que a div designada, eu queria saber um jeito correto de usar esse metodo de background img na div em uma imagem com muitos icones usando o background-position e um metôdo que a imagem se adeque a todas as resoluções sem problema, para que em todas as resoluções ela fique com alta qualidade

[MaikeES 18]

Boa noite amigo.

 

Bom posta o código pra gente ajudar melhor mas pelo que você está dizendo, no tamanho da imagem você tem que definir por px e não por % por exemplo

 

<img src='teste.jpg' width='200px' />

 

Fazendo desta forma sua imagem sempre terá o tamanho de 200px independente da resolução usada....

 

se ajudou da o potin positivo :)

[William Bruno 1501]

mais a partir de uma resolução pequena em que a imagem e a div se extende ficando maior ela perde qualidade

hum.. se vc está estendendo images, talvez a melhor alternativa para você não perder qualidade seja utilizar vetores, svg

[LeoO_DF 22]

um pequeno código séria, eu tenho essa imagem onde ficam os icones que eu reuni e fiz que são todos relativamente temporários do meu atual site:

 

e uso o seguinte para pegar cada um separado:

#content #Esquerdo ul.Image_Post li#Comentarios div div #Like_Coment{
	display:inline-block;
	position:relative;
	float:inherit;
	top:3px;
	margin:0;
	padding:0;
	width:16px;
	height:16px;
	background:url(../Administrativo/Conteudo/imagens/icones.png) no-repeat;
	background-position:2px 0px;
}
#content #Esquerdo ul.Image_Post li#Comentarios div div #Like_Coment:hover{
	background-position:2px -17px;
}
#content #Esquerdo ul.Image_Post li#Comentarios div div #Like_Coment.Active{
	background-position:2px -37px;
}

 

onde eu pego elas com background position, mais na minha resolução ela fica ótimo, mais em resoluções pequena ela perde muita qualidade, chegando a imagem ficar maior que a div e cortando a imagem, eu queria saber como fazer para isso não acontecer e ela não perde qualidade em resoluções pequenas

Boa noite amigo.

 

Bom posta o código pra gente ajudar melhor mas pelo que você está dizendo, no tamanho da imagem você tem que definir por px e não por % por exemplo

 

<img src='teste.jpg' width='200px' />

 

Fazendo desta forma sua imagem sempre terá o tamanho de 200px independente da resolução usada....

 

se ajudou da o potin positivo :)

Eu não uso % e sim px, mais uso <div></div> e ponho a imagem no background da div, e com isso queria saber como fazer isso sem que ela perca qualidade