Ir para conteúdo

Arquivado

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

leonardo-benitez

Como testar responsividade?

Recommended Posts

Boa tarde,

Estou desenvolvendo o seguinte site:

http://colmeia.florianopolis.ifsc.edu.br/index2.html

Para testar a responsividade em outros dispositivos, estou utilizando o quirktools:

http://quirktools.com/screenfly/#u=http%3A//colmeia.florianopolis.ifsc.edu.br/index2.html&w=360&h=640&a=39&s=1

Pela visualização do quirktools, tudo como eu esperava.

Entretanto, acessei o site através de dois celulares diferentes (utilizando o aplicativo google chrome) e o que vi foi apenas uma versão "redimensionada", pequena, da versão desktop.

A opção "modo desktop" do aplicativo estava desabilitada, e ainda assim o site não se adaptava a tela.

 

Posso confiar na visualização desses sites de teste? Ou estou testando da forma errada?

 

Obrigado!!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Para adaptar a visualização do meu site no celular estou usando este META, na página principal, mas ele não lê o menu Bootstrap direito no celular.

 

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  <!-- compativel com navegadores -->
<meta name="viewport" content="width=device-width, initial-scale=1">  <!-- uso com Mobile -->

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por Sapinn
      Tenha um menu hamburguer que abre a esquerda mas eu gostaria que ele abrisse a direita(O menu ficaria retrátil a direita ) para meu site se adequar a responsividade 
       
      codigo do menu que fica a esquerda 
       
      <!DOCTYPE html>
      <html>
      <head>
          <meta charset="utf-8">
          <title>Menu vertical reponsivo com html e css</title>
          <link rel="stylesheet" href="style.css">
          <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.0/font/bootstrap-icons.css">
          <style>
             *{
          margin:0;
          padding:0;
      }
      .menuMobileVertical a{
          text-decoration:none;
          color:white;
          display:block;
          padding:20px 5px;
      }
      .menuMobileVertical a:hover{
          background:rgba(176,224,230);
          color:black;
      }
      body{
          font-family:arial;
      }
      input[type="checkbox"]:checked ~ nav{
          transform: translateX(350px);
      }
      .menuMobileVertical ul{
          list-style:none;
          position:absolute;
          top:70px;
          width:100%;
          
      }
      .icone-menu{
          font-size:40px;
      }
      input[type="checkbox"]{
          display:none;
      }
      .menuMobileVertical{
          background:rgba(16,16,16,.5);
          width: 350px;
          height: 100vh;
          left:-350px;
          position: absolute;
          transition:all 0.5s;
          
      }
      label{
          padding:15px;
          position:absolute;
          z-index:1;
      }

          </style>
      </head>
      <body>
          <div class="menuMobile">
              <input type="checkbox" id="check">
              <label for="check"><i class="bi bi-list icone-menu"></i></label>
              <nav class="menuMobileVertical">
                  <ul>
                      <li><a href="">HOME</a></li>
                      <li><a href="">LOGIN</a></li>
                      <li><a href="">ALUNO</a></li>
                      <li><a href="">PROFESSOR</a></li>
                      <li><a href="">CONTATO</a></li>
          </ul>
          </nav>
      </div>
      </body>
      </html>
    • Por augustusdev
      Alguém tem um CPF para teste de API que possua muitos registros de cheque sem fundo, ou seja, que tenha CCF?
    • Por BelleFisio
      Olá! Bom dia!
       
      Tenho uma imagem que fica responsiva na maioria dos navegadores, porém no internet explore ela não fica responsiva. No iexplore ela tbm sai da posição correta, então fiz um codigo especifico para o iexplore (o posicionamento ficou correto, porém a imagem não esta responsiva)
       
      Teria alguma forma de corrigir isso?
       
      O codigo esta assim:
      <div class="conteudo"> <div id="cabeçalho"> <div class="logotipo"> <img src="arquivo/img/logotipo.png"> </div> </div> </div>  O CSS:
      .cabeçalho{width:90%;margin-left:auto;margin-right:auto;} .logotipo {width:100%;max-width:1000px;}} .logotipo img{width:100%!important;height:auto;max-width:180px;}  
      Obrigada
       
       
    • Por Dimas victor
      Bom dia me Chamo Dimas sou Testador de Software desde de 2015, gostaria da ajuda desse fórum que vejo com muito respeito para ajudar no meu questionário voltado para a área de testes onde verifico o nível de interesse e o conhecimento das pessoas na área de testes, desde já agradeço. Segue link logo abaixo:
      https://forms.gle/PDVJZ7kh1L4HkyQK8
    • Por laloproces
      Boa noite. Segue o texto do método main:
       
      /*O sistema basicamente faz é pedir informções para o usuário, pergutando quantas pessoas vai cadastrar, *qual o nome, telefone, se a pessoa trabalha, pede o cargo e a empresa para no final exibir essas informações na tela. */ public static void main(String[] args) { Scanner in = new Scanner(System.in); System.out.println("Quantas pessoas você vai cadastrar? (Somente números)\n"); int pessoas = (int)in.nextInt(); String[] nome = new String[pessoas]; String[] telefone = new String[pessoas]; String[] profissao = new String[pessoas]; String[] empresa = new String[pessoas]; int op = 0; for(int i=0; i<pessoas; i++) { System.out.println("\nDigite o nome do serumaninho:\n"); nome[pessoas] = in.toString(); //Tá dando erro aqui, provavelmente por causa da variável dinâmica pessoas System.out.println("\nDigite o telefone desse serumaninho:\n"); telefone[pessoas] = in.nextLine(); System.out.println("\nEsse vivente trabalha? (0 para não, 1 para sim)\n"); op = in.nextInt(); if(op == 1){ System.out.println("\nDigite a profissão dele:\n"); profissao[pessoas] = in.nextLine(); System.out.println("\nDigite o nome da empresa em que ele trabalha:\n"); empresa[pessoas] = in.nextLine(); } } for(int j=0; j<pessoas; j++){ if(op ==1){ Pessoa[] p = {new Profissional(nome[j], telefone[j], profissao[j], empresa[j])}; } else{ Pessoa[] p2 = {new Pessoa(nome[j], telefone[j])}; } } for(int h=0; h<pessoas; h++){ if(op==1){ Pessoa[] p = {new Profissional(nome[h], telefone[h], profissao[h], empresa[h])}; System.out.println(Arrays.toString(p)); } else{ Pessoa[] p2 = {new Pessoa(nome[h], telefone[h])}; System.out.println(Arrays.toString(p2)); } } } //Abaixo estão as classes, que estão em outros arquivos Java. public class Pessoa { public String getNome(){ return nome; } public void setNome(String nome){ this.nome = nome; } public String getTelefone(){ return telefone; } public void setTelefone(String telefone){ this.telefone = telefone; } private String nome; private String telefone; Pessoa(String nome, String telefone){ this.nome = nome; this.telefone = telefone; } void exibir(){ System.out.println(getNome()+" :: "+getTelefone()); } } //Abaixo a classe Profissional, derivada da classe Pessoa. public class Profissional extends Pessoa { private String profissao; private String empresa; public String getProfissao(){ return profissao; } public void setProfissao(String profissao){ this.profissao = profissao; } public String getEmpresa(){ return empresa; } public void setEmpresa(String empresa){ this.empresa = empresa; } Profissional(String nome, String telefone, String profissao, String empresa){ super(nome, telefone); this.profissao = profissao; this.empresa = empresa; } @Override public void exibir(){ super.exibir(); System.out.println("\tTrabalha como "+profissao+"no(a) "+empresa+"."); } } Minha dúvida é: como posso corrigir o problema sem tirar a maneira dinâmica do sistema e se da maneira como fiz não irá gerar outros erros ou poderia fazer de uma maneira mais simples.
      Desde já agradeço!
×

Informação importante

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