CSS Responsivo: A importância e COMO FAZER.
ฝัง
- เผยแพร่เมื่อ 29 ส.ค. 2024
- Responsividade é sempre um assunto que assusta muitos programadores web. Hoje viemos te explicar a necessidade de ter um site responsivo e como fazer um site responsivo através das media queries. Chega mais!
Ainda não conhece a DevMedia? Acesse: www.devmedia.c...
== Sigam-nos nas redes sociais:
LinkedIn: / devmedia
Facebook ➞ / devmedia.com.br
Twitter ➞ / devmedia
Instagram ➞ / devmedia.com.br
![[TH] 2024 PMSL SEA W3D1 | Fall | สัปดาห์ตัดสิน ทีมไปไฟนอล](http://i.ytimg.com/vi/ZBU3GyzqErI/mqdefault.jpg)
7:15 MOMENTO CODIGO RESPONSIVO :)
Valeu 👍
Muito bom o vídeo, Devmedia adiciona o conteúdo de "Grid".
estou estudando faz cerca de 1 mês, que estou focado, porém que leio documentos faz um tempinho e já tenho uma noção, html me garanto 80%, css mais ou menos, chega no momento que tenho que usar flexbox, grid e responsividade me fode, sofro muito com isso, só não pulei pra javascript pq não sinto segurança em css. espero um dia conseguir ser alguém na vida e um bom programador
tbm tenho receio com o flexbox, o grid e a responsividade
como tá hj em dia? alguma dica ?
@@MelbyLaaW cara eu fiquei consideravelmente bom em flexbox, comprei um curso e vi as aulas de grid, tenho uma base boa em grid só preciso praticar mais, js sei o basico do basico, mas to aprendendo sempre mais e mais mano só ter foco
@@theflores999como tá agora?
Eu peguei o básico de HTML e css, e passei a estudar JS. Hoje tô num nível bem legal em JS e indo pra um framework. Dps que eu passei a estudar JS, o HTML e css fluírem muito mais fácil. Pq vc deixa de fazer páginas estáticas. Você passa a ter interesse em fazer com que a página faça algo dinamicamente, e quando você se apaixona e aprofunda de verdade, vc sozinho vai querer entender como manda aquela informação ali pra um banco de dados.. como tu integra aquilo com um banco de dados.. é show dms
@@theflores999 E agora como vc tá hj em dia?
Vídeo Excelente. Bem explicado, bem apresentado, seguindo uma curva confortável. Os conteúdos da plataforma poderiam seguir mais esse método. Abraço.
Assinei a plataforma a dois meses e não me arrependi em nenhum momento.
Seria muito bom se na plataforma de vocês tivessem vídeos aulas assim
não tem?
@@natalirodriguesdasilva6312 Nao , mas é tudo mastigado.
Show. Responsividade é o próximo passo pra meus sites ficarem mais apresentáveis.
Muito bom!
Sempre tive uma certa insegurança quanto a media queries, mas esse video é bem simples e esclarecedor
muito bom o video, me ajudou, eu apanho muiiito com responsividade e flex-box, as vezes falta um detalhe que fode tudo, é um position que falta, o texto adapta e as divs não, as vezes adapta e não quebra, coisa que os mesmos cod de linhas de baixo iguais, funcionam e os da outra linha não funciona, em fim, um dia eu chego lá, no momento só consigo clonar sites e adapta-los.
Apanho muito tbm em responsivo
Um dos melhores canais e plataformas de estudos
Cara a responsividade é ESSENCIAL em um site, exemplo de ressponvidade:
Você tem um site só que varias pessoas que acessaram são mobile, e imagina, sem a responsividade o site fica bugado, da pra arrastar a tela
para todos os lados. Um exemplo, aperte F12 e clique num icone que parece o celular ali no console, vai criar uma "aba" , e arraste-a para os lados e veja se tem a responsividade ou não outra coisa, a responsividade explicada em poucas palavras seria: Os ajustes de TODOS os elementos conforme o tamanho da tela!
Finalmente vou conseguir fazer um site responsivo ou um modo mobile!
essa parada de não saber usar o computador é real, tenho uma irmã bem nova e ela ficou chocada que da pra acessar os mesmos sites pelo pc também, teve um momento que fiquei observando ela achando que ela ia tocar na tela do notebook achando que era touch kkkkkk
Esse finalzinho foi muito bom!
Estagiário fazendo seu trabalho...
Mais um vídeo de qualidade!
Poderia ter citado o mobile first, que ja é critério do Google pra ranking
excelente video, me salvou legal na aplicação de um projeto pessoal !!
sou front tbm os maiores desafios sao transformar paginas antigas em sites modernos responsivo
tamo aqui já 😂
Uma palavra, vcs sao fodas ! Parabens
vocês são demais!!
Muito bom! Um abraço de Portugal!
Vídeo sruim demais, enronla muito
Bom vídeo... Mas percebi que no site da devmedia no iphone 11 (que é o meu caso) tem algumas partes quebradas... Vai ter que aplciar esse vídeo no próprio site... rs
obrigado por nos ajudar, pode deixar o link aqui pra já resolver ?
Muito bom!
Top o conteúdo!
Funcionou!!!
Vlw, Vlw! 😁😁😁
Putz...'vai cebolinha' foi de f##de...hahahah xD Parabens pelo conteudo o/
Mas só acho que, se o início foi levantado a questão mobile, por questão de facilidade e boa pratica, sua estrutura iniciar com a menor tela não seria mais lógico?
Já testou fazer isso?
famoso mobile first
acho que cada um pode selecionar a forma que achar melhor de trabalhar. Eu no caso, prefiro deveras utilizar max-width
Valeu!!😊
Muito bom o vídeo.
Agradecemos, Pablo!
legal amigos gostei
tem que colocar os codigos em todas as paginas pra funcionar?
Massa!
Finalmente aprendi caraioooooooo
O exemplo foi ótimo pra entender responsividade, mas só de usar % ou vw no width já resolvia para todos os dispositivos
Pessoal, uma dúvida... Existe uma forma de fazer a responsividade na medida que você vai diminuindo uma janela, sem precisar definir uma largura fixa, tipo um auto?
Tem o flexbox, mas dependendo da largura/altura, os itens ainda fiquem estranhos... Por isso talvez seja melhor usar as Media Query's
o video comeca aos 06:06
é uma má prática colocar medias para diversas larguras e tamanhos ?
Muito bom o vídeo, mas a qualidade do audio deixa a desejar um pouco. Recomendaria que vocês investissem em microfone de lapela como modelo Sony ECM-CS3. Uso ele e gosto bastante. Abraço e parabéns pelo sucesso.
Meu esta com esse problema
o thiago programa des do tempo do ENIAC
Eu faço com display: flex e media queries
Fazer cara de mau ajuda o Css ficar melhor?? Kkkkkk grande abraço, obrigado pelo conteúdo
Tenho duas dúvidas, tem algum limite de media query para usar na responsividade??? ou posso tacar 20 media query em uma pag kkkkkk, e tem um certo padrão entre os dev, para indicar a max/min-width???
Não é apenas uma exclusão digital..... Tenho conhecidos com iPhone novo e que não sabem usar o computador
Dica de ouro: se for mobile e quer testar e não têm notebook, use o Acode Premium, se não tiver dinheiro pode piratear mesmo 😂, só não pegue vírus por favor, ele tem como regular escala e tamanho
Alguem sabe um curso bom pra responsividade pra dev front-end? Pq quando vou deixar responsivo fico em duvida com tamanho de imagens, padding, margin, unidades do css, etc
F pra que ta perdido no css
Governo tem acesso a tudo que precisa e mesmo assim consegue ser um dos piores acessos via digital
A Devmedia faz App comercial?
Qual programa vocês usam para simular a responsividade no navegador?
Chrome dev tools. Não é um programa exatamente, é uma ferramenta do browser que você acessa com F12
o que foi que o Erick disse aqui 9:01 ?? O home ta falando até Árabe
Quem sabe faz ao vivo. 09:13
arruma o footer de vcs que ta torto, no ipad some informação e usem o window resizer no chrome, alias deviam ensinar isso no curso.
Ainda bem que existe o bootstrap pra agilizar este processo chatinho heheheh
Evito ao máximo usar @media