No video

Aprenda CSS Position em 10 Minutos - Tutorial CSS para Iniciantes

  Рет қаралды 38,312

Tiger Codes

Tiger Codes

Күн бұрын

Neste tutorial, vamos falar sobre a propriedade position no CSS. Position static, relative, absolute, fixed e sticky.
Aprenda a posicionar elementos e fique fera 🐅 no CSS!
#webdevelopment #html #css
🔗 Recursos
CodePen codepen.io/tig...
📚 Capítulos
00:00 Introdução
00:51 position: static
02:52 position: relative
04:20 position: absolute
06:33 position: fixed
08:57 position: sticky
10:04 Conclusão
🐅 Seja um assinante Tiger Codes
Aprenda front end do zero em tigercodes.com...
Use o código KZfaq para 15% off no seu primeiro pagamento.
🌐 Redes Sociais
TikTok / tigercodes
Instagram / tiger_codes
Twitter / tiger_codes

Пікірлер: 144
@felipeassumpcao3039
@felipeassumpcao3039 3 жыл бұрын
Parabéns pela didática simples e prática, ajudou muito estou no meio de um freela aqui e foi necessário usar muito position! ajudou muito.
@TigerCodes
@TigerCodes 3 жыл бұрын
Fico contente que te ajudei diretamente desta forma, em um freela. Volte sempre no canal, Felipe! :)
@pablosalazar8945
@pablosalazar8945 2 жыл бұрын
melhor vídeo do youtube sobre position, é o melhor canal pra aprender e tirar duvidas sobre desenvolvimento web. sempre me salva.
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz de salvar na hora certa :)
@brunoeiji936
@brunoeiji936 2 жыл бұрын
Que explicação foda irmão, vlw dms !!
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz em ajudar!
@enzomonaco8073
@enzomonaco8073 2 жыл бұрын
Cara, ajudou demais. Tinha ficado totalmente perdido nessa parte de position.
@shoy0ed1ts
@shoy0ed1ts 3 жыл бұрын
Muito bom cara, agora consigo entender essa bagaça. To amando seus vídeos
@TigerCodes
@TigerCodes 3 жыл бұрын
Feliz que pude ajudar. Terá vídeo novo essa semana :)
@Cortes_do_Peixe
@Cortes_do_Peixe 10 ай бұрын
Passou o conhecimento de forma muito mais didática que vários cursos que já fiz
@brunobrito6281
@brunobrito6281 2 жыл бұрын
muito obrigado, tava uns dias para sem entender e muito obrigado mesmo
@davidedson2281
@davidedson2281 Жыл бұрын
Cara essa aula, me ajudou D+++... Agora consegui colocar os botões da minha calculadora, do jeitinho que eu queria! Parabéns pelo vídeo ajudou muito mesmo.
@TigerCodes
@TigerCodes Жыл бұрын
Disponha!
@vanortonvan6437
@vanortonvan6437 2 жыл бұрын
Cara, que explicação show, já tinha um bom tempo que eu assistia vídeos e não conseguia entender, mas depois dessa aula entendi e fiquei fera em position, muito obrigado mano, tmj.
@TigerCodes
@TigerCodes 2 жыл бұрын
Feliz em ter te ajudado!! 🐅
@PedroPaulo-rr7cz
@PedroPaulo-rr7cz 2 жыл бұрын
Rápido e direto parabéns pelo vídeo
@TigerCodes
@TigerCodes 2 жыл бұрын
Obrigado!
@edsonhorta2732
@edsonhorta2732 2 жыл бұрын
melhor aula sobre css position vc é foda mano
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que te ajudou!
@Naomigdg
@Naomigdg 2 жыл бұрын
Aula muito esclarecedora, estava fazendo sites da internet com html e css pra praticar, e isso estava me deixando com dúvida nas partes de sobrepor algo com o absolute, muito obrigado pela ótima aula.
@TigerCodes
@TigerCodes 2 жыл бұрын
Sucesso e bons estudos, Gubi! Conta comigo ;)
@RenardBergson
@RenardBergson 2 жыл бұрын
Que vídeo incrível, cara! Estou começando agora nesse mundo da programação e seu vídeo me esclareceu muito a cabeça. Muito grato!
@TigerCodes
@TigerCodes 2 жыл бұрын
Disponha! :)
@eduardoribeiroxavier9279
@eduardoribeiroxavier9279 3 жыл бұрын
Vídeo super bacana, com ensinamentos ótimos para quem ta iniciando, parabéns.
@TigerCodes
@TigerCodes 3 жыл бұрын
Obrigado pelo elogio! :)
@joaopaulopachs
@joaopaulopachs 3 жыл бұрын
Conteúdo top mano, parabéns pela dedicação!
@TigerCodes
@TigerCodes 3 жыл бұрын
Valeu João!!
@viniciusnunes9026
@viniciusnunes9026 2 жыл бұрын
Vídeo muito top , muito explicativo e de simples resolução . Obrigado
@TigerCodes
@TigerCodes 2 жыл бұрын
Valeu, Vinicius!
@gleysibianchi3807
@gleysibianchi3807 2 жыл бұрын
Muito bom, ficou fácil de entender!
@gabrielberg6736
@gabrielberg6736 3 жыл бұрын
Me ajudou muito cara, faz mais vídeos assim!!
@TigerCodes
@TigerCodes 3 жыл бұрын
Valeu!!! É satisfação minha saber que te ajudou! Pode deixar que tem mais conteúdos desse vindo aí 😉👊🏻
@wesleyjunior7267
@wesleyjunior7267 2 жыл бұрын
muito bem explicado, me ajudou bastante, obrigado !
@TigerCodes
@TigerCodes 2 жыл бұрын
Disponha!
@eldiegojuan
@eldiegojuan 2 жыл бұрын
Ajudou muito, estou literalmente comendo CSS. VOU entender essa bagaça!!!
@TigerCodes
@TigerCodes 2 жыл бұрын
Conte comigo na sua jornada! 🐅
@victorhugomorbeckserafim4734
@victorhugomorbeckserafim4734 2 жыл бұрын
Meu amigo meus parabéns, me ajudou infinito! Continue assim!
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que ajudou! Tem mais tutorial vindo aí! :)
@bdt7483
@bdt7483 2 жыл бұрын
Cacete mano! É impressionante a forma que você ensina... Vi vários vídeos e apenas o seu fez com que eu entendesse. Obrigado!
@TigerCodes
@TigerCodes 2 жыл бұрын
Missão cumprida, fico feliz então. Obrigado por assistir! 🐅
@caiogabriel4098
@caiogabriel4098 2 жыл бұрын
top demais, sua didática é muito boa.
@TigerCodes
@TigerCodes 2 жыл бұрын
Obrigado! Fico feliz que gostou.
@faobi
@faobi 2 жыл бұрын
Ajudou bastante, ainda deu uns exemplos práticos, eu tava caçando mesm :") Valeu
@TigerCodes
@TigerCodes 2 жыл бұрын
Disponha! Volte sempre para conteúdos novos :)
@tiagobarros5510
@tiagobarros5510 Жыл бұрын
Cara… vc é incrível, estava meio perdido
@TigerCodes
@TigerCodes Жыл бұрын
Muito obrigado, Tiago! A intenção era ajudar quem estava perdido mesmo 😊
@aylanaqueiroz8889
@aylanaqueiroz8889 2 жыл бұрын
Meu Deus, melhor video de position que ja vi, e olha que vi muitos! Muito obrigada e parabens!!!
@TigerCodes
@TigerCodes 2 жыл бұрын
Eu que agradeço por ter assistido, fico feliz que você gostou 🐅
@GarimpandoGeral
@GarimpandoGeral Жыл бұрын
Maravilha! É isso aí, sem muito embromação. Grande abraço e meu muito obrigado
@TigerCodes
@TigerCodes Жыл бұрын
Eu que agradeço
@linealyne
@linealyne 2 жыл бұрын
Gostei muito do jeito que vc ensina, deu pra aprender legal
@TigerCodes
@TigerCodes 2 жыл бұрын
Feliz em ajudar 💙
@tavaresbr1
@tavaresbr1 2 жыл бұрын
Muito bom de verdade mesmo. Tava quebrando a cabeça pra manter uma parada fixa no topo e esse video me mostrou como é fácil e simples de fazer
@TigerCodes
@TigerCodes 2 жыл бұрын
Que bom que ajudou :)
@adambastos8465
@adambastos8465 2 жыл бұрын
Você é brabo, explicação top!
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que gostou!
@ICARO7
@ICARO7 Жыл бұрын
Muito foda irmão, Deus te abençoe 😃🙏
@TigerCodes
@TigerCodes Жыл бұрын
Obrigado! Fico feliz que gostou 💙🐅
@mateussanfer
@mateussanfer 11 ай бұрын
Estava tentando fazer uma landing page sozinho, e fiquei travado nessa parte, porque eu tinha uma ideia mas, não tinha ideia de como fazer e nem como pesquisar. Mas, do nada seu vídeo apareceu 😂😂😂. Valeu mesmo
@kohls20
@kohls20 3 жыл бұрын
Muito bom, ajudou muito!!!!
@TigerCodes
@TigerCodes 3 жыл бұрын
Fico feliz que ajudou 🐅
@fhokster
@fhokster 2 жыл бұрын
Cara eu tava quebrando a cabeça pra entender isso e tua didática ajudou. Vlw demais!
@TigerCodes
@TigerCodes 2 жыл бұрын
Que bom que ajudou
@matheusmoreira3167
@matheusmoreira3167 2 жыл бұрын
Valeu pelo conteúdo mano, didática simples e direta, fácil de aprender, era o que eu precisava
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que que te ajudou!
@Mark.Robins
@Mark.Robins 2 жыл бұрын
Parabéns, muito boa aula
@TigerCodes
@TigerCodes 2 жыл бұрын
Muito obrigado, fico feliz que a aula foi útil 🐅
@robertos2
@robertos2 Жыл бұрын
Muito top gosto da sua didática a pessoa aprende fácil
@PedroRodrigues_Cantor
@PedroRodrigues_Cantor 2 жыл бұрын
Que vídeo top matou minhas dúvidas
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz de ter ajudado :)
@mmarcosjk9991
@mmarcosjk9991 6 ай бұрын
muito bom video, me ajudou com minhas anotações
@Bruno_Rodrigues809
@Bruno_Rodrigues809 2 жыл бұрын
Explicação foda dms mano , mt obrigado , ganhou mais um seguidor 👏🏽👏🏽👏🏽
@alissonlima3735
@alissonlima3735 3 жыл бұрын
Caraca, me ajudou muiitoo... manja muito cara parabéns
@TigerCodes
@TigerCodes 3 жыл бұрын
Fico feliz que te ajudou 🐅
@henriquelira6656
@henriquelira6656 2 жыл бұрын
Finalmente entendi essa bagaça. Parabéns pela linha didática
@TigerCodes
@TigerCodes 2 жыл бұрын
Feliz que tornei a aula útil pra você :)
@marcosbarros883
@marcosbarros883 2 жыл бұрын
Explicação sensacional. Parabéns!!
@biel_inc
@biel_inc 2 жыл бұрын
Gostei, muito obrigado.
@TigerCodes
@TigerCodes 2 жыл бұрын
Feliz em poder ajudar. 🐅
@fabioverlaine7274
@fabioverlaine7274 2 жыл бұрын
Show Tiger !!! Bem explicado... SUCESSO FERA ! Sugestão.. pela clareza da sua explicação, um video como usar o GRID para layouts. valeu
@TigerCodes
@TigerCodes 2 жыл бұрын
Valeu pela sugestão, Fabio! Já está nos planos.
@tissue.1578
@tissue.1578 3 жыл бұрын
Só consegui entender com você, muito bom vídeo. +1 inscrito, hehe.
@TigerCodes
@TigerCodes 3 жыл бұрын
Obrigado!
@tissue.1578
@tissue.1578 3 жыл бұрын
@@TigerCodes Fala um pouco sobre a propriedade display, acho que seria interessante.
@everyday_fit
@everyday_fit 2 жыл бұрын
parabéns, mt bem explicativo
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que ajudou!
@levyjr6857
@levyjr6857 2 жыл бұрын
esse cara é mt foda
@marcosyuri443
@marcosyuri443 2 жыл бұрын
cara '-' tu é demais
@AMVization
@AMVization Жыл бұрын
Top mano sua didática ganhou mais um inscrito ❤️
@renanfernandes1950
@renanfernandes1950 2 жыл бұрын
Tô maratonando kkkkk seus vídeos são ótimos.
@carloseduardofiani6168
@carloseduardofiani6168 Жыл бұрын
Vlw irmão, ajudou muito
@TigerCodes
@TigerCodes Жыл бұрын
Disponha, Carlos
@wilker31vivas
@wilker31vivas 3 жыл бұрын
Muito obrigado pude entender melhor
@TigerCodes
@TigerCodes 3 жыл бұрын
Missão cumprida! 🐅
@hideplys7001
@hideplys7001 2 жыл бұрын
Rapaz, me ajudou d++
@TigerCodes
@TigerCodes Жыл бұрын
Fico feliz que ajudou! 💙🐅
@iordanlucas1
@iordanlucas1 2 жыл бұрын
Ótima didática! Obrigado!
@TigerCodes
@TigerCodes 2 жыл бұрын
Disponha :)
@Dash_well
@Dash_well 3 жыл бұрын
Não para de fazer vídeo ! Por favor KAKAKAKKA
@TigerCodes
@TigerCodes 3 жыл бұрын
Se você continuar assistindo, eu vou continuar fazendo 🔥
@Dash_well
@Dash_well 3 жыл бұрын
@@TigerCodes to vendo é tudo mano, vou agora recriar o facebook (login)
@fillipeoliveiraconta
@fillipeoliveiraconta 2 жыл бұрын
Faça mais vídeos assim!
@cortesverissimo
@cortesverissimo 2 жыл бұрын
Aula maravilha
@TigerCodes
@TigerCodes 2 жыл бұрын
Obrigado. :) Bons estudos!
@carlos19793
@carlos19793 5 ай бұрын
Nicolas tuas dicas são excelentes, meu amigo, te pergunto...como deixar estes três programas na janela a esquerda? Fica muito fácil programar assim... muito obrigado. Carlos Alberto.
@rivaldosouza362
@rivaldosouza362 3 жыл бұрын
ganhou um seguidor, muito bom trabalho
@TigerCodes
@TigerCodes 3 жыл бұрын
Valeuu :)
@arnaldoneto7351
@arnaldoneto7351 8 ай бұрын
muito bom
@thiagodasilva622
@thiagodasilva622 2 жыл бұрын
Perfeito.
@arthurfrancovital5705
@arthurfrancovital5705 2 жыл бұрын
magnífico
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que gostou 😊
@baptistajeanbaptiste6832
@baptistajeanbaptiste6832 3 жыл бұрын
Aula top
@TigerCodes
@TigerCodes 3 жыл бұрын
Fico feliz que gostou :)
@matheuscoffers8983
@matheuscoffers8983 2 жыл бұрын
brabissimo
@TigerCodes
@TigerCodes 2 жыл бұрын
Fico feliz que gostou 🐅
@trilhacoder
@trilhacoder 2 жыл бұрын
Parabéns cara, muito boa sua explicação, +1 inscrito. Abç.
@TigerCodes
@TigerCodes 2 жыл бұрын
Obrigado!
@gabrielcamargo3160
@gabrielcamargo3160 Жыл бұрын
ganhou meu like so por ter criado div usando um ponto
@gilbertofreitas1092
@gilbertofreitas1092 Жыл бұрын
muito bom mano
@gabrielcamargo3160
@gabrielcamargo3160 Жыл бұрын
viu meu amigo e como eu faço pra delimitar o codigo? lorem cria scroll horizontal... tem nas conf como faz pra ele chegar a um maximo de tamanho e quebrar no codigo html?
@mateusdavi8017
@mateusdavi8017 2 жыл бұрын
Qual seria a diferença entre o Fixed e o Sticky? Ótimo vídeo, obrigado!!
@TigerCodes
@TigerCodes 2 жыл бұрын
A diferença está nos usos/nas possibilidades criativas deles. O sticky “gruda” na tela do usuário a partir de um ponto no scroll (útil para uma sidebar que vai acompanhando a leitura do artigo de um blog, por exemplo), já o fixed ficará sempre fixado/parado no lugar (mais comum para cabeçalho ou navegação que fica sempre no topo da página).
@victorlandi
@victorlandi 2 жыл бұрын
Cara, eu to 2 dias tentando posicionar os itens dentro do css, pqp kkk uma interfere na outra e tals, mas enfim, acho que faz parte esse processo de querer jogar o pc na rua.
@TigerCodes
@TigerCodes Жыл бұрын
Faz sim Victor, perfeitamente normal 🤓
@lucasmzzo
@lucasmzzo 3 жыл бұрын
Quando você quiser jogar um conteúdo centralizado na div.. usa o padding ou o margin ?? os 2 dão certo, mas qual o conceito mais certo
@TigerCodes
@TigerCodes 3 жыл бұрын
Padding é preenchimento/espaço interno da caixa (a cor de background aumenta junto com ele), margin é espaço externo da caixa. Essa é a principal diferença entre eles, daí se seu elemento não tem cor no background por exemplo, tanto faz usar qualquer um dos dois, vai dar no mesmo.
@ramonvinicius4419
@ramonvinicius4419 3 жыл бұрын
Muito boa a aula! Da primeira vez que eu vi o ícone da Netflix ali em baixo eu pensei que era outra coisa ( ͡° ͜ʖ ͡°)
@migasx4933
@migasx4933 2 жыл бұрын
Estou tentando por video de apresentacao abaixo so que a animação azul da meu menu (COR de Inicio, Sobre, Contacto .... fica inativo) ;;--;; por favor me ajudem.
@icaropereira3472
@icaropereira3472 2 жыл бұрын
bueno
@geovannabraga5806
@geovannabraga5806 2 жыл бұрын
Que dica você dar para quem quer aprender html e css bem ?
@TigerCodes
@TigerCodes 2 жыл бұрын
Praticar, praticar e praticar.
@dac-ti
@dac-ti 2 жыл бұрын
Eu leio e em seguida me perco com posicionamento... onde colocar, se a tag container ou no próprio que desejo manipular, sempre confundo onde e como usar as propriedades display e afins. Irritado, não deveria ser tão confuso, rs alguma dica de ematerial?
@alexbastos_
@alexbastos_ 2 жыл бұрын
Mano, como você faz aquilo ali de escrever "lorem100" e ele já te dar o texto pré-pronto?
@TigerCodes
@TigerCodes 2 жыл бұрын
Este é apenas um dos vários recursos do Intellisense embutido no VS Code, basta digitar lorem100 e apertar tab.
@vitorcosta6495
@vitorcosta6495 2 жыл бұрын
é recomendada usar essas tecnicas em tela de login ? e como é fazer a parte de responsividade dessas propriedades ?
@TigerCodes
@TigerCodes 2 жыл бұрын
Tudo vai depender do que você está fazendo, mas para sair usando a propriedade position para fins de layout eu não recomendo, são só casos mais específicos mesmo, como os citados no vídeo.
@pedroigor3394
@pedroigor3394 10 ай бұрын
Irmão bom dia, estou precisando de ajuda em css. Como entro em contato com vc
@athenasarantopoulos
@athenasarantopoulos 3 жыл бұрын
Amei
@TigerCodes
@TigerCodes 3 жыл бұрын
Valeu 💙🐯
@CLEISON304
@CLEISON304 2 жыл бұрын
Nao sou escrito no seu canal mas e uma pergunta que muitas pessoas deve esta se perguntando tem mesmo que aprender grid e flex box pro que e um saco essas duas coisa para se trabalhar numa empresa e um pe no saco um pe nao e bater com os dois julhoes nos ovos
@fisaque
@fisaque 2 жыл бұрын
Agora que estava aprendendo o vídeo acabou ?? Kkk
@TigerCodes
@TigerCodes 2 жыл бұрын
Hahahah, fico feliz que curtiu. :) Aproveita e confira mais tutoriais aqui no canal
@fisaque
@fisaque 2 жыл бұрын
@@TigerCodes vendo quase todos só dicas show, essa parte de alinhamento é fogo, revirando aqui o KZfaq para aprender.. posta mais conteúdos aí de alinhamento... Parabéns
@RaphMart
@RaphMart Жыл бұрын
Aprenda tudo sobre positions do CSS em 25 minutos
25:17
Matheus Battisti - Hora de Codar
Рет қаралды 33 М.
UNO!
00:18
БРУНО
Рет қаралды 4,3 МЛН
EVOLUTION OF ICE CREAM 😱 #shorts
00:11
Savage Vlogs
Рет қаралды 14 МЛН
The Joker saves Harley Quinn from drowning!#joker  #shorts
00:34
Untitled Joker
Рет қаралды 53 МЛН
Aprenda JAVASCRIPT em apenas 5 MINUTOS (2023)
5:24
Tiger Codes
Рет қаралды 102 М.
Top 10 Dicas de VS Code // Use o VS Code Como um Profissional
6:10
Pare de chutar e aprenda a position: absolute #06
19:23
Marco Bruno
Рет қаралды 48 М.
10 Tailwind Classes I Wish I Knew Earlier
13:31
Web Dev Simplified
Рет қаралды 176 М.
OS TIPOS DE DISPLAY DOS ELEMENTOS - HTML E CSS
12:13
Eduardo Mota
Рет қаралды 18 М.
CSS Position ou Flexbox? Qual é melhor?
26:32
Serliv
Рет қаралды 2,6 М.
CSS Grid Layout e Flexbox - Quando Utilizar
39:09
Origamid
Рет қаралды 648 М.