Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

phk

Como aumentar ícone conforme a tela diminui

Por , em Desenvolvimento frontend

Recommended Posts

phk    0

phk
Postado

Olá.

 

Estou criando um site e já consegui fazer as fontes mudarem de tamanho, conforme o tamanho da tela. Se a tela do usuário for um celular, as fontes aumentam e ficam legíveis.

 

Agora preciso que determinados ícones em png, também aumentem da mesma forma, ficando legíveis em telas menores.

 

O código de uma das imagens é este: 

<img style="width: 45px; height: 12px;" alt="" src="logomar.png"><br>

Queria saber o que devo incluir para que quando a tela for menor que 480 pixel, a imagem dobre de tamanho.

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend

  • Conteúdo Similar

    • leonardorafaeldev
      Icone da pagina não aparece na busca mobile
      Por leonardorafaeldev
      Boa noite pessoal estou com um problema que o icone do meu site não aparece no mobile segue uma foto do problema o meu codigo esta assim
       
      <!-- icones -->   <link href="icones/favicon.ico" rel="icon">   <link href="icones/favicon.ico" rel="shortcut icon">    <link rel="apple-touch-icon" sizes="57x57" href="icones/apple-icon-57x57.png">   <link rel="apple-touch-icon" sizes="60x60" href="icones/apple-icon-60x60.png">   <link rel="apple-touch-icon" sizes="72x72" href="icones/apple-icon-72x72.png">   <link rel="apple-touch-icon" sizes="76x76" href="icones/apple-icon-76x76.png">   <link rel="apple-touch-icon" sizes="114x114" href="icones/apple-icon-114x114.png">   <link rel="apple-touch-icon" sizes="120x120" href="icones/apple-icon-120x120.png">   <link rel="apple-touch-icon" sizes="144x144" href="icones/apple-icon-144x144.png">   <link rel="apple-touch-icon" sizes="152x152" href="icones/apple-icon-152x152.png">   <link rel="apple-touch-icon" sizes="180x180" href="icones/apple-icon-180x180.png">   <link rel="icon" type="image/png" sizes="192x192"  href="icones/android-icon-192x192.png" >   <link rel="icon" type="image/png" sizes="36x36" href="icones/android-icon-36x36.png">   <link rel="icon" type="image/png" sizes="48x48" href="icones/android-icon-48x48.png">   <link rel="icon" type="image/png" sizes="96x96" href="icones/android-icon-96x96.png">   <link rel="icon" type="image/png" sizes="144x144" href="icones/android-icon-144x144.png">   <link rel="icon" type="image/png" sizes="72x72" href="icones/android-icon-72x72.png">   <link rel="icon" type="image/png" sizes="32x32" href="icones/favicon-32x32.png">   <link rel="icon" type="image/png" sizes="96x96" href="icones/favicon-96x96.png">   <link rel="icon" type="image/png" sizes="16x16" href="icones/favicon-16x16.png">   <link rel="manifest" href="icones/manifest.json">   <meta name="msapplication-TileColor" content="#ffffff">   <meta name="msapplication-TileImage" content="icones/ms-icon-144x144.png">   <meta name="theme-color" content="#ffffff">   <meta charset="utf-8">   <meta content="width=device-width, initial-scale=1.0" name="viewport">
    • Jack Oliveira
      Usando ícone no style background
      Por Jack Oliveira
      Boa tarde @Omar~
      poderia me dar uma ajuda se for possível
       
      preciso retirar uma imagem de um testemunho de cliente
      porém se eu remover a div e colocar <i class="fa fa-user"></i>
      ele não fica legal porém com a imagem tem uma classe que a imagem fica dentro de um circulo
      porém o meu cliente ele não quer por imagem de pessoas ele opinou em usar este ícone informado ai
       
      o que eu não conseguindo é fazer este ícone ficar dentro deste círculo corretamento teria alguma ideia de como fazer funcionar beleza?
       
      O meu HTMl esta desta desta forma com a imagem que fica normal 
       
      <div class="item"> <div class="testimony-container"> <div class="testimony-image img-responsive" style="background: url(./midias/depoimento/priscila.jpg)"> </div> <div class="testimony-content"> <h3>Paulo</h3> <blockquote> <p><p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores.<br></p></p> </blockquote> </div> </div> </div> Aí tentei usar desta forma 
       <div class="testimony-image img-responsive" ><i class="fa fa-user"  style="font-size: 85px;"></i>
      porém ele não fica certo dentro do circulo
       
      Se puder da uma ajuda fico grato mano...
       
       
    • merlinus
      Problema com upload
      Por merlinus
      Saudações, tive recentemente a troca de servidor, no novo servidor um script para envios de arquivos parou de funcioar para arquivos maiores de 1M (acho)
      Consigo enviar um arquivo de 130k tranquilamente, qdo envio de 1.5M dá o sequinte erro:
       
      estou com as seguintes configurações do php.ini (confirmei usando phpinfo)
      memory_limit: 128M
      post_max_size: 8M
      upload_max_filesize: 10M
       
      Alguma ideia de que configuração pode estar dando erro?
    • mytools
      Como mudar o tamanho do botão
      Por mytools
      Boa noite,
      Podem me ajudar com o botão comprar da minha loja?
      Gostaria de deixar um pouco menor, mas não sei onde alterar no html/css
       
      http://style-theme.lojavirtualnuvem.com.br/br/
       
    • mytools
      Como mudar o tamanho do botão
      Por mytools
      Boa noite,
      Podem me ajudar com o botão comprar da minha loja?
      Gostaria de deixar um pouco menor, mas não sei onde alterar no html/css
       
      http://style-theme.lojavirtualnuvem.com.br/br/
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito