Jump to content

Search the Community

Showing results for tags '@media'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Q&A Desenvolvimento
    • Perguntas e respostas rápidas
  • Desenvolvimento e Banco de Dados
    • HTML e CSS
    • Java
    • Javascript
    • .NET
    • PHP
    • Python
    • Ruby
    • Mobile
    • Ambientes de Desenvolvimento
    • Arquitetura e Métodos Ágeis
    • Banco de Dados
    • DevOps
    • Desenvolvimento de Games
    • E-Commerce e Pagamentos Online
    • SEO e Otimizações
    • WordPress
    • Algoritmos & Outras Tecnologias
  • Design e Produto
    • Fotografia
    • Photoshop
    • Design de interfaces e UX
    • Edição/Produção de Vídeos
    • Marketing Online
    • Desenho, Ilustração e 3D
  • Entretenimento e uso pessoal
    • Geral
    • Segurança & Malwares
    • Gadgets e wearable
    • Softwares e Apps
    • Entretenimento

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Google+


Hangouts


Skype


Twitter


deviantART


Github


Flickr


LinkedIn


Pinterest


Facebook


Site Pessoal


Localização


Interesses

Found 2 results

  1. EdPaulino

    Responsividade

    Bom dia pessoal, estou tentando inserir um menu responsivo no meu projeto, mas quando acesso pelo celular ele não se adapta, continua do mesmo jeito que no computador, o que deve-se fazer pra forçar-lo a se adaptar? segue codigo: <!-- <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Menu RESPONSIVO</title> <!---<link rel="stylesheet" href="style.css">--> </head> <style> *{ margin: 0; padding: 0; } .menu{ width: 100%; height: 50px; background-color: #f0f0f0; font-family:'Arial'; } .menu ul{ list-style:none; position: relative; } .menu ul li{ width: 150px; float: left; } .menu ul ul{ position: absolute; visibility: hidden; } .menu ul li:hover ul{ visibility: visible; display:block; } .menu a{ text-decoration: none; display: block; padding: 15px; text-align: center; background-color: #f6f6f6; color: #000; } .menu a:hover{ background-color: #f4f4f4; } .menu ul ul li{ float: none; border-bottom: 1px solid #000; } .menu ul ul li a{ background-color: #f0f0f0; } label[for="bt_menu"]{ padding: 5px; background-color: #d0d0d0; font-family: 'Arial'; text-align: center; font-size: 30px; width: 50px; height: 50px; } #bt_menu{ display: none ; } label[for="bt_menu"]{ display: none; } @media (max-width: 800px){ label[for="bt_menu"]{ display:block; margin-left: 0; } #bt_menu:checked ~ .menu{ margin-left: 0; display: block; } .menu{ margin-top:5px; margin-left: -100%; transition: all .4s } .menu ul li{ width:100%; float: none; } .menu ul ul{ position:static; overflow: hidden; max-height: 0; transition: all 2s; } .menu ul li:hover ul{ height:auto; max-height: 200px; } } </style> <body> <input type="checkbox" id="bt_menu"> <label for="bt_menu">&#9776;</label> <nav class="menu"> <ul> <li><a href="#">Home</a></li> <li><a href="#">Serviços</a> <ul> <li><a href="#">Criação de Sites</a></li> <li><a href="#">Artes Visuais</a></li> </ul> </li> <li><a href="#">Cursos</a> <ul> <li><a href="#">Java</a></li> <li><a href="#">Photoshop</a></li> <li><a href="#">HTML/CSS</a></li> </ul> </li> <li><a href="#">Contato</a></li> </ul> </nav> </body> </html> --->
  2. Luccas Gaulia

    Classes de acordo com a resolução

    Ola Pessoal, Estou organizando o css e queria que a classe que fica no index (exemplo: se-include) utilizando uma classe do Bootstrap, mas de acordo com a resolução... Assim, ele colocaria a class de acordo com a resolução seria o tamanho do Bootstrap.... Não esta funcionando, então poderiam me ajudar? /** Smarthphones no formato "retrato" **/ @media screen and (min-width: 480px) and (orientation:landscape){ html{ font-size: 14px; } .btn{ font-size: 12px; } .se-include, .col-md-12{ } } /** Tablets e Smarthphones de segunda geração **/ @media screen and (max-width: 780px) and (orientation:portrait){ html{ font-size: 14px; } .se-include, .col-md-12{ } } /** Desktops, Laptops e TVs. **/ @media screen and (min-width: 780px){ html{ font-size: 16px; } .se-include, .col-md-8, .col-md-offset-2 { } }
×

Important Information

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