Criando Um MENU NAVBAR RESPONSIVO | HTML CSS JAVASCRIPT - HTML E CSS Para INICIANTES
HTML-код
- Опубликовано: 7 сен 2024
- Criando Um menu navbar responsivo html css javascript - html e css para inciantes para iniciantes
como criar menu responsivo em html css e js(javascript)
🛑5 ERROS QUE UM INICIANTE COMETE QUANDO ESTUDA PROGRAMAÇÃO: bit.ly/ebook-5...
⚠Jamais Clique Aqui⚠: bit.ly/334OGxc
Nesse tutorial você vai aprender a como criar um menu responsivo em html, css e javascript. Este menu responsivo será criado de forma simples para que todos aprendam e usando tags semânticas do html5 e técnicas de design responsivo para criar sites responsivos! Para o nosso menu mobile ficar responsivo vamos usar o css flexbox.
Continuando na criação do nosso menu mobile responsivo com html css javascript precisamos criar uma pasta com o nome do nosso projecto que pode ser qualquer nome, no nosso caso vamos chamar o nome da pasta para menu responsivo e dentro dela vamos preparar o ambiente e criar os arquivos necessários para a criação do menu navbar responsivo que vai ser o arquivo html(index.html), arquivo css(style.css) e arquivo javascript(main.js).
Aprenda hoje mesmo neste tutorial de programação web front-end a criar um menu responsivo com javascript.
Link do códico fonte: github.com/mat...
=================Vídeos Relacionados====================
👉Como Fazer uma LANDING PAGE RESPONSIVA SIMPLES com HTML E CSS: • Como Fazer uma LANDING...
👉[PASSO A PASSO] Tela de login simples HTML e CSS: • Tela de login HTML e C...
👉Como Fazer MENU DROPDOWN Com HTML e CSS | Como criar Submenu em HTML e CSS: • Como Fazer MENU DROPDO...
👉Como Criar uma CALCULADORA com HTML, CSS e JAVASCRIPT: • Video
=====================================================
❌Link Importante❌: bit.ly/334OGxc
=====👉Converse Comigo👈=====
⚡Instgram: / matheusmanuel.dev
⚡Github: github.com/mat...
=====👉Links Importantes👈=====
Se subescreva no Canal: / @matheusmanuel
🔥Me Ajude: bit.ly/334OGxc
Obrigado, 💕Matheus Manuel
#MatheusManuel #MenuResponsivo #html #css #javascript #js
![Tela de login HTML e CSS Responsivo[PASSO A PASSO]](http://i.ytimg.com/vi/Fg6ayE-sYj4/mqdefault.jpg)
![Tela de login HTML e CSS Responsivo[PASSO A PASSO]](/img/tr.png)
Não esqueça de se increver no canal e
⚠Jamais Clique Aqui⚠: bit.ly/334OGxc
Bom demais, super simples e didático!
Cara, você é incrível!
Me ajudou bastante, eu comecei a estudar HTML e CSS agora no curso, e de verdade queria me aprofundar. Com seus vídeos consegui. Obrigado, você é incrível, novamente!
Muito bom!!! Funcionou perfeitamente.
Simples e objetivo. Ótimo trabalho
Que bom que ajudou :)
Muito top, curti dms seu canal. Achei meio veloz demais o video, mas indo pausando da pra entender 100%.
Muito bom, gostei muito. Parabéns! 👏🏼👏🏼👏🏼
Muito obrigada 🙌
Seus vídeos tem me ajudado muito, e você explicando passo a passo cada ação fica ainda melhor!! Valeu por trazer esse tipo de conteúdo, sucesso
Irmão fico feliz que o meu vídeo te ajudou,obrigado! Muito sucesso em dobro pra você
você é foda cara, estou fazendo um processo seletivo e tenho que entregar ate segunda feira, seu video me ajudou demais
irmão brabo vc tem muito talento vc vai ficar famoso
Melhor video de botão responsivo que eu ja vi, já vi muitos videos de menu responsivo mas a logica é sempre dificil, neste video finalmente consegui entender a lógica, sério muito obrigado
Que bom que ajudou! tamo junto
O homem é fera!
Você é fera amigão! Parabens pela didatica, pela iniciativa e pelo conteudo, nota 10!
Parabéns mano, você ensina muito bem. Curto muito seus videos, continue a postar... faz da proxima vez um modal...
Obrigado ai amigão.
Muito obrigada ,muito boa explicação.Que DEUS O ABENÇOE!CONTINUE COM OS VIDEOS !!!
De nada! Que DEUS te abençoe em dobro. Vou continuar sim!
Parabéns Mateus , ótimo conteúdo que Deus possa te abençoar muito irmão.
Muito obrigado 🙌 irmão
braboo! o seu menu responsivo está muito top
Só agradeço
Parabéns Matheus!
Obrigadão amigão!!
Parabéns pelo video, vc é fera cara!
Muito obrigado
Obrigado Matheus!
Obrigado, me salvou. Sucesso pra você!😁
Que bom que ajudou
simples e top!
Obrigado.
o video ajudou me muito , mais faltou em como criar o icone para ficar X
Nesse vídeo eu fiz com o ícone de X: ruclips.net/video/ht5EyIo0_wY/видео.html
ANGOLA EM PESO
Bom tutorial, apenas acho que faltou uma certa aprofundada ao explicar cada inserção de código (ao menos mais ou menos o que cada coisa fazia) e seria melhor tirar 90% desses cortes aí, porque o que era pra deixar o vídeo mais curto e dinâmico acabou deixando recortado demais. Não tem problema demorar ou não ao digitar; somos humanos e não máquias. De resto, muito obrigado por disponibilizar conteúdo assim no youtube, ajuda demais. Abs!
Mano muito obrigado! realmente eu fiz os muitos cortes pra tentar deixar esse vídeo dinâmico mano aqui é só agradecer teu comentário me deu mais clareza do que fazer e não fazer!! Vai me ajudar nos próximos vídeos valeu demais!
Olá no main.js para que está retornando a variavel menuBtn (no minuto 11:24) ? Parabéns pelo vídeo.
Olá Fernando! A variável menuBtn ela seria a variável para eu pegar ou selecionar o ícone do menu(ícone das três barrinhas) em que depois eu ia fazer aquele esquema de abri e fechar o menu em que quando clicassem na variável menuBtn (que nesse caso é o ícone) ele poderia abrir o menu ,caso não clicassem no menuBtn o menu continuaria fechado!
No arquivo main.js a variável menuBtn ela pode ser apagada porque nós não usamos ela no vídeo ,porque depois eu decidi usar função menuShow com o evento de clique no ícone lá no arquivo html.
Eu coloquei a variável menuBtn pela força do hábito porque eu estou habituado sempre que faço um menu responsivo com html css e javascript de sempre usar a variável menuBtn, e eu nem dei conta!
Muito obrigado por expor a sua dúvida porque sem você eu não poderia ver esse erro muito obrigado mesmo ! Minhas sinceras desculpa se te deixou confuso. abraços Matheus!
@@MatheusManuel agradeço pela explicação
De nada! Sempre que puder eu farei
ameeeei
Olá! O que é essa classe que aparece nos 3:30? "fa fa-bars fa-2x"? Tentei reproduzir aqui no meu código e não deu certo...
Olá! A classe fa fa-bars é referente ao ícone das três barrinhas! Você colocou o font-awesome no seu site
Fiz igual a você,mas quando vou rodar não funciona o botão
olá lucas Santiago, já verificou se fez tudo certo?
Eu queria colocar ela pra direita, tem como eu fazer isso?
oi assim so aparece uma opção e não aparece as outras
Não entendi bem a sua dúvida
O que significa esse flex-wrap?? ótimo vídeo!
a propriedade flex-wrap ela defina a quebra de linha do container flexivel ou seja se vai poder executar uma quebra de linha ou não nos itens filhos do container flexivel ou melhor se os itens do container flexivel vão passar pela linha de baixo ou não! ela aceita alguns valores por padrão ela tem o valor nowrap.
Espero ter ajudado!
pt-br? Você não fala o português de Portugal?
pt-br português do brasil. eu falo português de Angola