Roger Costa
Roger Costa
  • 9
  • 8 216
CSS Box Model
Aprenda sobre as 4 áreas importantes dos elementos HTML, o porque do nome "box model" e as diferenças entre content-box e border-box do Box Sizing.
Link para a página de documentação da aula:
www.rogercosta.dev/conteudo/aula-semanal/box-model.html
Se inscreva na lista de espera do meu curso "Web Dev Start":
www.rogercosta.dev/inscreva-se/espera/webdev-start/
Me acompanhe no instagram:
rogercostadev
Переглядів: 23

Відео

Unidades de Medidas no CSS
Переглядів 2821 день тому
Seja bem vindo a mais uma aula e hoje falo um pouco mais sobre Unidades de Medidas disponíveis no CSS e mostro exemplos de uso. Se inscreva na lista de espera do meu curso "WebDev Start": rogercosta.dev/inscreva-se/espera/webdev-start/index.html? Link para a documentação do vídeo: rogercosta.dev/conteudo/aula-semanal/unidades-de-medidas.html Inscreva-se para receber as próximas aulas: rogercost...
CSS Position: posicionando elementos no HTML.
Переглядів 3928 днів тому
Muito bem vindo(a) a primeira aula semanal. Nessaaula, você aprenderá sobre a propriedade position em CSS e como ela pode ser usada para posicionar elementos em uma página web. Você também aprenderá sobre os diferentes valores da propriedade position, incluindo static, relative, absolute, fixed e sticky. Se inscreva na lista de espera do meu curso "WebDev Start": rogercosta.dev/inscreva-se/espe...
Criando uma Página de Captura do Zero - HTML, CSS & JavaScript.
Переглядів 65Місяць тому
Aprenda a criar uma página de captura totalmente do zero, utilizando HTML, CSS e JavaScript. Acesso aos slides de HTML, CSS & JS: www.figma.com/design/jd7rBKAVwKBWd9YcnRZiIo/Aulão-HTML,-CSS-&-JavaScript?node-id=1995-2&p=f&t=mqvnMkvw9lyzXIeH-0 Acesso ao projeto que desenvolvemos na aula: www.figma.com/design/jd7rBKAVwKBWd9YcnRZiIo/Aulão-HTML,-CSS-&-JavaScript?node-id=1670-2&p=f&t=mqvnMkvw9lyzXIe...
Mostrando/escondendo elementos em tela sob condição.
Переглядів 826 місяців тому
Nesse vídeo eu mostro como eu fiz a animação de mostrar o botão fixo de CTA somente se outro elemento não estiver aparecendo no viewport (visualização da tela). Parte do código mostrado no vídeo: pastebin.com/38yJjvmJ API IntersectionObserver: developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
Construindo uma seção de conteúdo dinâmico no Elementor
Переглядів 8 тис.3 роки тому
Aprenda a como construir uma seção que mostra e esconde seções a partir de um clique no botão. Nome das classes CSS apresentadas no vídeo: Para a seção que envolve tudo: use-hide-system Para cada elemento de ação (botão): hide-system-action Para cada elementor de reação: hide-system-reaction Link para o Script: kyuss-studio.notion.site/Script-de-Conte-do-Din-mico-c0cacd86f4c4461899e027b34429079...

КОМЕНТАРІ

  • @souamandabahia
    @souamandabahia 6 днів тому

    👏🏻👏🏻👏🏻👏🏻

  • @souamandabahia
    @souamandabahia 24 дні тому

    👏🏻👏🏻👏🏻👏🏻

    • @rogercostadev
      @rogercostadev 24 дні тому

      Obrigado, Amanda! Próxima semana tem mais conteúdo novo ai :)

  • @souamandabahia
    @souamandabahia 25 днів тому

    Mais didático, impossível

    • @rogercostadev
      @rogercostadev 25 днів тому

      Obrigado, @souamandabahia, em breve postarei mais conteúdos ^^

  • @souamandabahia
    @souamandabahia 25 днів тому

    O melhorrrr 👏🏻👏🏻👏🏻👏🏻👏🏻

  • @MacAngle
    @MacAngle Місяць тому

    ¡Qué buen video! Siempre me ha fascinado cómo se puede crear una página desde cero. 🤔 Una vez intenté hacer algo similar y terminé con un diseño bastante loco. 😂 ¿Alguien más ha tenido experiencias divertidas con HTML y CSS? Por cierto, estoy empezando a aprender programación en сodigо hеrое, y me está encantando. 🙌🏻

    • @rogercostadev
      @rogercostadev Місяць тому

      Muchas gracias. Intente obtener algunas referencias de diseñadores de UI, quienes seguramente podrán crear mejores diseños. Publicaré más contenido pronto :)

  • @focopublicidade2058
    @focopublicidade2058 5 місяців тому

    Cara tentei fazer com o ajuda do chat gtp mas não deu certo, pedi pra ele indicar um video no youtube que falava sobre a questão e ele mandou seu link! Incrível, deu certo, perfeito. Gratidão

  • @leonardodossantosferreira6703
    @leonardodossantosferreira6703 5 місяців тому

    como faço para adiciona um X nas sessões de reação para fechar elas? outra pergunta, como que faço pra deixar a sessão fechada? exemplo: quando entro no site a sessão de REAÇÃO já está aberta. quero que ela abra somente se eu clicar nela! ou seja, quero que ela comece fechada.

  • @antoniocarlossantos280
    @antoniocarlossantos280 6 місяців тому

    Muito bom conteúdo

    • @rogercostadev
      @rogercostadev 6 місяців тому

      Obrigado meu querido! Vou tentar trazer alguns conteúdos assim mais rápido e direto ao ponto. Esse eu achei que ficou muito longo, até, mas tá valendo :P

  • @joaorabelo4473
    @joaorabelo4473 9 місяців тому

    Conteúdo excelente !!!

    • @rogercostadev
      @rogercostadev 9 місяців тому

      Obrigado meu brother, tamo junto!

  • @RickIISouza
    @RickIISouza 10 місяців тому

    Excelente! Aulão Top Roger.. 🚀🚀

    • @rogercostadev
      @rogercostadev 10 місяців тому

      Obrigado meu querido! Vem muito mais por ai.

  • @maritrevisann
    @maritrevisann 11 місяців тому

    que penaaa que não está funcionando o link do script 😪 queria tentar

    • @rogercostadev
      @rogercostadev 11 місяців тому

      Oiii, atualizei o link com o script na descrição do vídeo ^^

  • @FelipeRibeiro-ib1fv
    @FelipeRibeiro-ib1fv Рік тому

    Roger, tudo bem? Ainda é possível disponibilizar os links? Estão fora do ar

    • @rogercostadev
      @rogercostadev Рік тому

      Opa, me chama no WhatsApp: 13982280148, que te passo por lá :)

  • @eyghtsbit
    @eyghtsbit Рік тому

    @rogercosta9370 eu fiz um layout onde as seções tem um video no background, porém o vídeo só inicia na primeira seção que já é carregada, quando eu clico nos demais, o vídeo de fundo não inicia, tem algum código que force o vídeo de fundo iniciar? Independente se ele foi o primeiro ou a ultima seção que cliquei. valeu demais pelo suporte.

  • @guilhermecoimbra4642
    @guilhermecoimbra4642 Рік тому

    Fala Roger, parabéns pelo conteúdo. Estou com uma dúvida, quando coloco o código para funcionar, ele funciona perfeitamente, mas o id css para de funcionar, não consigo usar o botão com link ancora, tem alguma coisa que posso fazer para resolver isso?

  • @RobsonLima-ty4td
    @RobsonLima-ty4td Рік тому

    O Wordpress atualizou e é impossível incluir sessões internas agora, somente conteiners. Talvez seja por isso que não está funcionando comigo. Segui o passo a passo certinho, mas por alguma razão não está funcionando.

  • @GustavoHenrique-gc8uw
    @GustavoHenrique-gc8uw Рік тому

    BRABO

  • @gustavobraga4073
    @gustavobraga4073 Рік тому

    Comentando mais uma vez aqui, só pra ajudar o video e o canal. Mandou benzaço. Fiz e deu certo. Obrigado.

  • @gustavobraga4073
    @gustavobraga4073 Рік тому

    Caraaaaaaaaaaa do céu. Parabénzaço. O mundo é melhor por pessoas iguais a você. Mto obrigado mesmo.

  • @guilhermefranca130
    @guilhermefranca130 Рік тому

    tem como disponibilizar o link?

  • @guilhermesantana6045
    @guilhermesantana6045 Рік тому

    Opa, mano o link tá quebrado tem algum novo?

  • @thiagofrancisco3486
    @thiagofrancisco3486 Рік тому

    Simplesmente genial! Utilizei hoje para configurar um blog de lançamento, cada botão mostra uma aula em destaque e não precisamos mais criar uma página para cada aula! Muito obrigado por compartilhar seu conhecimento Roger!

  • @RaulRoccha
    @RaulRoccha Рік тому

    Sensacional! Funcionou perfeitamente. Obrigado!

  • @WaveMeddia
    @WaveMeddia Рік тому

    Fala Roger, tranquilo? Com o Widget de carrossel está dando bug já tentei de tudo e não consigo resolver, sabe o que é?

  • @fellypesullivan6096
    @fellypesullivan6096 Рік тому

    Você é simplesmente um GÊNIO! Muito obrigado por compartilhar tal conhecimento com a gente, isso contribui bastante. Parabéns.

    • @rogercostadev
      @rogercostadev 11 місяців тому

      Rapaz, não tinha visto esse comentário. Muuuiito obrigado!

    • @fellypesullivan6096
      @fellypesullivan6096 11 місяців тому

      @@rogercostadev Valeu, mestre! Hahaha

    • @rogercostadev
      @rogercostadev 11 місяців тому

      @@fellypesullivan6096 aproveitei e já atualizei o link para o script, que tava quebrado :D

  • @oluanmontenegro
    @oluanmontenegro Рік тому

    Links estao quebrados. tem como atualziar?

  • @LexPlayGamesBR
    @LexPlayGamesBR 2 роки тому

    Muito bom esse video...serio. Mas fiquei com uma duvida, eu tentei ocultar uma pagina de vendas inteira e não consegui. Só consigo ocultar o que está dentro da seção interna. Tem como ocultar uma seção inteira? Obrigado

  • @filipecarvalho1569
    @filipecarvalho1569 2 роки тому

    CARA QUE CONTEÚDO IRADO! Parabéns, você me ajudou pra caramba, obrigado!!!

  • @Frater-Binyamin
    @Frater-Binyamin 2 роки тому

    Roger, você salvou minha vida rsrsrsrs. Eu tinha que fazer uma seção daquelas onde mostra a equipe com 4 fotos e no container ao lado apresentando o currículo de cada um. Apliquei as tuas instruções conforme o meu layout e funcionou tudo corretamente. Para dar uma incrementada ainda coloquei um botão dentro de cada seção do currículo onde abre um popup com mais informações sobre cada um. Interessante que funciona bem em qualquer estrutura que vc quiser aplicar. Show de bola, te agradeço grandemente a aula, já me inscrevi e deixei o like (pena que só pode dar um like, pois vale mil likes!). Um abração e muito sucesso pra ti!

  • @brunofontana1631
    @brunofontana1631 2 роки тому

    Como fazer para que as sessões passem automaticamente?

  • @brunorafaelmartins6254
    @brunorafaelmartins6254 2 роки тому

    Roger, o link para o script esta off, tem como disponibilizar novamente?

  • @rodrigoeumermo5967
    @rodrigoeumermo5967 2 роки тому

    Cara, você explica muito fácil. Parabéns pelo vídeo. Você sabe fazer um site em ajax no wordpress, ou seja, acessar as páginas sem dar refresh nas páginas?

  • @rebecaribeiro154
    @rebecaribeiro154 2 роки тому

    Me ajudou muito! Segui o passo a passo e deu tudo certo. Muito obrigada!!

  • @marcmenezes123
    @marcmenezes123 2 роки тому

    Eu consigo fazer utilizando o elementor Free ?

  • @edvaldosaturnino5162
    @edvaldosaturnino5162 2 роки тому

    CONTEÚDO SENSACIONAL ROGER!! MUITO OBRIGADOO!! Tive uma dúvida, tem como configurar o hide-system pra aumentar ou diminuir um fontsize e/ou criar um outline abaixo do texto (caso eu use um texto como o disparador action)???

    • @rogercostadev
      @rogercostadev 2 роки тому

      Olá Edvaldo! Fico grato por ter gostado do conteúdo! Sobre sua dúvida, é possível, sim, porém, apenas com CSS. Tive bastantes pessoas tendo essa mesma dúvida que você, e estou pensando em gravar algum vídeo sobre isso.

  • @gisellevitors2
    @gisellevitors2 2 роки тому

    Muito obrigada pelo conteúdo me ajudou bastante! Não consegui entender como adquirir os scripts para elementor no seu site. Como posso fazer para encolher a seção aberta clicando de novo no botão?

    • @rogercostadev
      @rogercostadev 2 роки тому

      Olá Giselle, entra em contato comigo pelo whatsapp que retiro suas dúvidas: 13 982280148 :)

  • @scr1647
    @scr1647 2 роки тому

    Fala Roger! boa noite! muito bom o teu vídeo, me diz uma coisa funciona pra o container do elementor pró tambem? testei e nao funcionou

  • @gabapsd8648
    @gabapsd8648 2 роки тому

    Funcina em 2 sessão ?Gostaria de fazer com um produto, ai a pessoas clicasse na quantidade, e aparece a foto do produto e outra sessão do lado com o valor

  • @crocobrasil
    @crocobrasil 2 роки тому

    boa jovem,faz um curso de codigos voltados para elementor,so projetinhos assim.vai da bom.heheh

  • @maisdesignporfavor2518
    @maisdesignporfavor2518 2 роки тому

    Parabéns, excelente projeto. Você fez o que muitos precisavam e nos ofereceu isto sem custo algum. Agora eu fiquei com uma questão. Como faria para ao clicar no botão funcionar o âncora para ir direto para a seção a ser mostrada. Exemplo: o botão está numa seção muito acima da que está oculta e quando você clicar no botão além de mostrar a seção, ainda dar scroll até a seção exibida?

    • @rogercostadev
      @rogercostadev 2 роки тому

      Fico feliz que o script tenha te ajudado. Sobre o scroll, tem uma opção que faz justamente isso, se eu não me engano eu adicionei depois que gravei o vídeo. Tenta o seguinte: vai onde você adicionou a classe CSS 'use-hide-system', e em atributos/attributes, adiciona essa nova opção: hide-system-scroll | 1

  • @euthabis
    @euthabis 2 роки тому

    Pelo amor de Deus, que vídeo maravilhoso salvador da pátria! Eu passei A TARDE caçando algo que resolvesse esse meu problema,e o seu foi o ÚNICO que realmente me ajudou! Muiiiito obrigada! 😍

    • @rogercostadev
      @rogercostadev 2 роки тому

      Fico feliz que tenha te ajudado, Thabata :)) Me segue no Instagram que em breve lançarei novidades: @rogercostadev

  • @viniciosdsgn
    @viniciosdsgn 2 роки тому

    vai funcionar com o container agora?

    • @rogercostadev
      @rogercostadev 2 роки тому

      Opa, então, não tem porque não funcionar.

  • @itamarsilvajunior
    @itamarsilvajunior 2 роки тому

    Roger gloria a Deus pela sua vida, muito obrigado pelo script, ele me salvou em projeto de um cliente!

    • @rogercostadev
      @rogercostadev 2 роки тому

      Fico feliz que o script tenha te ajudo, Itamar! Qualquer coisa, chama ai! Eu tenho um produto digital, um pacote de scripts para Elementor, da uma olhada depois: rogercosta.dev/scripts-para-elementor :)

    • @itamarsilvajunior
      @itamarsilvajunior 2 роки тому

      @@rogercostadev Vou olhar demais!

  • @clubedosinvestimentos
    @clubedosinvestimentos 2 роки тому

    Parabéns pela excelência em transmitir conhecimentos. Roger Costa, tem alguma forma de inserir atributos nos blocos e botões sem ter necessidade de comprar uma licença do Elementor? Obrigado!

  • @leonardojuliano2537
    @leonardojuliano2537 2 роки тому

    Não estou conseguindo entrar no link do código, alguém pode disponibilizar ?

    • @rogercostadev
      @rogercostadev 2 роки тому

      Olá Leonardo. O link está offline, mesmo, no momento. Me chama no WhatsApp que te envio o código do vídeo: 13 982280148.

  • @juliosilva2822
    @juliosilva2822 2 роки тому

    Onde que compra seus script?

    • @rogercostadev
      @rogercostadev 2 роки тому

      Fala Júlio, obrigado pelo interesse. Pode comprar aqui: rogercosta.com.br ou me chama no WhatsApp 13 982280148