Jump to content

Recommended Posts

OLÁ AMIGOS , QUERIA SABER OQUE DEVO FAZER PARA CRIAR UM SITE , MAS PARA VERSÕES NÃO SO DESKTOP, MAS TAMBEM  MOBILE, PORQUE EU CRIEI UM SITE , MAS QUANDO O ACESSEI PELO CELULAR ESTAVA DESORGANIZADO E COMO VERSÃO DESKTOP! QUERIA A AJUDA DE VOCÊS !

  • -1 1

Share this post


Link to post
Share on other sites

@luannsr12, bem vindo ao fórum. Evite postar títulos em maiúsculo e tente ser mais claro no seu questionamento.

Como você desenvolveu seu site? Tem link? 

 

--- 

 

Alterei o título do seu post

OQUE POSSO UTILIZAR PARA CRIAR UM SITE EM HTML CSS ETC.. PARA VERSÕES MOBILE E DESKTOP?  -> Site Mobile

Share this post


Link to post
Share on other sites

Olá luan, acredito que isso ocorra por você definir valores exatos no tamanho dos componentes que formam o seu site.

Pesquise um pouco sobre o conceito de responsividade, você pode aplica-lo facilmente em seu site utilizando o bootstrap por exemplo. Espero ter ajudado. :)

Share this post


Link to post
Share on other sites

Tente usar media queries, por exemplo:

No HTML:

<!DOCTYPE html>
	<html>
      <head>
        <title>Media Query</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
      </head>
      <body>
        <div class="caixa">Alguma coisa</div>
      </body>
	</html>

No CSS:

.caixa{ background: blue; }
@media screen and (max-width: 768px){
  .caixa{ background: red; }
}

Assim, quando alguém acessar o site pelo celular, a div terá como cor de fundo vermelho e não azul. Usando esses princípios você pode otimizar o site para dispositivos móveis com um CSS específico para tal.

Espero que tenha ajudado ;)

Share this post


Link to post
Share on other sites
Em 02/04/2017 at 20:23, joaomart disse:

Tente usar media queries, por exemplo:

No HTML:


<!DOCTYPE html>
	<html>
      <head>
        <title>Media Query</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
      </head>
      <body>
        <div class="caixa">Alguma coisa</div>
      </body>
	</html>

No CSS:


.caixa{ background: blue; }
@media screen and (max-width: 768px){
  .caixa{ background: red; }
}

Assim, quando alguém acessar o site pelo celular, a div terá como cor de fundo vermelho e não azul. Usando esses princípios você pode otimizar o site para dispositivos móveis com um CSS específico para tal.

Espero que tenha ajudado ;)

Obrigado Amigo .. me ajudou

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By Emilio Saymon
      tenho um site que precisa que assim que eu aperte um botão ele verifiquei se a variavel sala for sala 1 ele abre no modal da sala1 se não abre no modal da sala2. Dei uma pesquisada e vi que da pra fazer com a função onclik(), mas não tenho noção como fazer. Aqui vai o código.
      botão <td><a href="#" class="btn btn-primary" data-toggle="modal" data-target="#modalLoginForm">XXX</a></td> <!-- sala 1 --> <div class="modal-body mx-3"> <div class="md-form mb-4"> <form method="POST" action="valida.php"> <h6>Sala 1</h6> <input type="password" class="form-control validate" name="senha"> </div> </div> <button type="submit" class="btn btn-primary" name="enviar">Entrar</button> </form> </div> </div> </div> </div> </div> <!-- sala 2 --> <div class="modal fade" id="modalLoginForm2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header text-center"> <h4 class="modal-title w-100 font-weight-bold">Senha</h4> <button type="btn-primary" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="modal-body mx-3"> <div class="md-form mb-4"> <form method="POST" action="valida.php"> <p>Sala 2</p> <input type="password" class="form-control validate" name="senha2"> </div> </div> <div class="modal-footer d-flex justify-content-center"> <button type="submit" class="btn btn-primary" name="enviar1">Entrar</button> </form> </div> </div> </div> </div>  
    • By danicarla
      Bom dia pessoal,

      Quero fazer um link com o titulo de uma cor e o texto em outra, mas quando passar o mouse em cima queria que a cor dos dois ficasse igual
      Meu codigo está assim:
      <style type="text/css"> a.ChamadaNoticias:link{text-decoration:none;} a.ChamadaNoticias:visited{text-decoration:none;} a.ChamadaNoticias:hover{color: #00FF05;text-decoration:underline;} .tituloA{font-family:'Open Sans', sans-serif;color:#00698C;font-size:16px;font-weight:bold;} .textoB{font-family:'Open Sans', sans-serif;color:#333;font-size:16px;} </style> <a href="#" class="ChamadaNoticias"> <div class="tituloA">Titulo da noticia</div> <div class="textoB">Aqui vai uma breve descrição da noticia</div> </a> Como preciso fazer com meu CSS para quando passar o mouse em cima mudar a cor do titulo e do texto para mesma cor?
    • By joazinDev
      Estou tentando calcular duas horas e as vezes precisso que ela saia negativa tbm
      Exemplo:
      07:33 - 07:48 = -00:15
      Como faço isso utilizando php ?
    • By ThosuZ
      Olá, pessoal. Tudo bom? Estou com um problema aqui. Criei uns links em um site pra levarem pra uma galeria, são imagens que estão lado a lado, cada uma com a imagem principal de cada galeria. O problema é: eu criei elas como background de li's de uma ul. Coloquei um <span> dentro da tag <li> pra poder aparecer o nome da galeria quando passar o mouse por cima. Observem o código:
       
      HTML:
       
      <ul id="artefotos">                 <a href="lorena.html" target="_self" class="glink"><li id="ft01"><span>Lorena Frazzão</span></li></a>                 <a href="vivian.html" target="_self" class="glink"><li id="ft02"><span>Vivian Nadine</span></li></a>                 <a href="paula.html" target="_self" class="glink"><li id="ft03"><span>Paula Bernardes</span></li></a>                 <a href="anaclara.html" target="_self" class="glink"><li id="ft04"><span>Ana Clara</span></li></a>                 <a href="marcus.html" target="_self" class="glink"><li id="ft05"><span>Marcus Visasi</span></li></a>                 <a href="davi.html" target="_self" class="glink"><li id="ft06"><span>Davi Serrano</span></li></a>                 <a href="rafaejr.html" target="_self" class="glink"><li id="ft07"><span>Rafaela & Jr</span></li></a>             </ul>  
      CSS:
       
      ul#artefotos li span {     font-size: 15pt;     text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5);     line-height: 1120px;     padding: 10px;     opacity: 0;     transition: 0.5s; }   ul#artefotos li:hover span {     opacity: 1;     background-color: rgba(0, 0, 0, 0.5); }   a.glink {     color: #fff; }   ul#artefotos {     width: 1470px;     margin: 0 auto;     margin-top: -20px;     padding: 25px;     overflow: hidden;     list-style: none; }   ul#artefotos li {     float: left;     width: 200px;     height: 600px;     margin: 5px;     background-color: #363636;     box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); }   ul#artefotos li#ft01 {     background: url('../_images/_essays/_lorena/IMG_2651.jpg') no-repeat;     background-position: 50% 50%;     background-size: 400px; }   ul#artefotos li#ft01:hover {     background: url('../_images/_essays/_lorena/IMG_2651.jpg') no-repeat;     background-position: 50% 50%;     background-size: 400px;     filter: opacity(25%); }  
      Porém, na última seção do CSS, eu coloquei um :hover pra quando passar o mouse, o fundo ficar menos opaco e a tipografia mais legível. Mas a tipografia também ficou menos opaca, já tentei colocar esse :hover no span como background: rgba(0,0,0,0.5); mas também não deu certo, porque ele fica apenas um retângulo em volta dele.
       
      Alguém sabe como resolver pra deixar toda a imagem menos opaca e a tipografia normal quando passar o mouse?
       
      Valeu!

    • By pheureunanda
      Olá, sou nova no fórum e na área de programação web, estou me dedicando a aprender tudo sozinha, só que há uma dúvida minha que eu quebro cabeça até hoje para resolvê-lá, mas até agora não consegui. É que eu quero saber como se centraliza e alinha as áreas de sidebar e post como nessas imagens que eu fiz de exemplo: 
      Como eu faço para deixa-las centralizadas e alinhadas uma do lado da outra com a distância que eu determinar? 
       
      E na primeira imagem de exemplo: como eu faço para deixar a área de sidebar dividida em blocos de tamanhos iguais um embaixo do outro? 
       
      Se alguém puder me ajudar... Estou recorrendo a esse fórum. 
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.