E aí até a próxima a propriedade que nós vamos aprender é a margem a margem serve para dar um espaço em branco em uma das direções do elemento em relação à parte de cima da esquerda de baixo ou da direita então o exemplo aqui de Margem nós podemos usar esse nosso título um aqui aqui mesmo né eu posso passar assim o valor chamado margem propriedade margem eu posso especificar margem que lado top por exemplo margem a parte de cima o cara dá uma margem para parte de cima quando que eu quero dar a vamos dizer
que eu quero 50 pixels por exemplo olha só o que que vai acontecer presta atenção que que vai acontecer quando eu the control S olá ele afastou-se eu colocar 150 pixels olá ele é fácil da parte de cima 150 pixels poderia colocar aqui também em porcentagem então poderia colocar sem as cinco porcento ele afastou a cinco porcento 15 por cento o 25 porcento tá entendendo então eu posso fazer isso em relação ao tamanho da minha página ou colocar especificamente a quantidade em pixels que eu quero Então eu quero que a parte de cima seja afastado
50 pixels a parte de baixo também já tem uma margem Zinha mas eu quero que essa margem seja maior Então como é que eu faço margem bottom O que é para parte de baixo eu quero que seja 150 pixels olha só que que ele vai fazer ele afastou a parte de baixo 150 pixels de um espaçamento aqui para mim e se eu quero afastar que desse ponto para lá né é a margem a esquerda então eu faria margem Oeste e colocaria aqui um supor 50 pixels Olha lá que que ele fez afastou de si canto
aqui 50 pixels ai eu quero que da direita ele me afaste 50 pixels Então faço margem braço White e a direita 50 pixels assim e aí ele me afastou 50 pixels aqui 50 pixels aqui em cima 50 pixels e embaixo 150 pixels certo só para a gente ter diferenças de tamanhos eu vou colocar senha de cima 30 e a de baixo vou deixar 150 esquerda eu vou deixar 20 e a direita vou deixar 70 certo para gente ter uma diferença aqui beleza de Margem Você pode passar todas essas propriedades que a gente colocou apontando a
direção num atalho mais rápido né vamos dizer um short Hand que a gente chama que quando a gente faz tudo numa mesma declaração usando a propriedade margem só assim margem E aí a gente pode passar os valores a propriedade de Margem ela aceita os quatro parâmetros que a gente viu aqui topo Bottom left right então o primeiro que você vai passar é sempre do Topo então o nosso topo aqui seria 30 pixels aí você dá um espaço o próximo vai se dizem respeito à direita então é topo depois direito à nossa direita seria 70 pixels
depois a gente vai ter em baixo embaixo seria há 50 pixels E aí a gente teria por último a esquerda que seria no nosso caso 20 pixels então colocar esse 20 fixo então com essa declaração eu tô falando numa linha só que eu quero que ele de margem do topo de 30 pixels margem à direita de 70 pixels a parte de baixo 150 pixels EA esquerda 20 pixels social a pagar esses daqui ó apaguei e deixar só esse daqui dá um control é se você vê que ele vai ter exatamente o mesmo efeito porque eu
tô Passando todas as direções numa declaração só beleza a gente usa muito muito muito mesmo essa propriedade margem tá pessoal propriedade margem ela é muito importante a gente usa Principalmente para o afastamento entre itens para a gente poder alinhar tudo direitinho na maneira como a gente quer dentro do nosso site fazer as questões de alinhamento né então ela é bem importante e por exemplo poderia colocar aqui ó eu quero que os parágrafos sejam mais afastados como é que eu poderia fazer isso vou salvar aqui deixar sem margem nenhuma aqui no H1 mas eu quero que
os meus parágrafos sejam mais afastados um do outro então eu colocaria margem botton uma margem embaixo Opa digitei errado aqui é de 40 pixels por exemplo olha só que que vai acontecer salvei eu afastei como tá sendo aplicado em todos os parágrafos cada um dos parágrafos afastou 40 se eu colocar mais aqui ó esses então vou ficar mais afastados tá vendo show de bola né pessoal Então essa é a propriedade margem para a gente afastar elementos a gente poderia colocar um pouquinho afastado a margem a esquerda para não ficar colada ali ó margem Leste Vou
colocar aqui 10 pixels Olha já faz tem um pouquinho aqui da margem ou até afastar um pouquinho mais 20 é que ficou afastar Dinho que estava colada aqui na beira da minha página certa então as margens a gente usa bastante também uma propriedade bem importante para a gente deixar o nosso visual aqui do jeito como a gente quer usar alinhamento da organização aqui dos elementos né a gente usa bastante essa propriedade Vejo você na próxima aula forte abraço espero que você tenha gostado dessa aula que tenha te ajudado se você quiser continuar assistindo o curso
pode continuar clicando no nesses cards que estão aparecendo aqui deixa o seu gostei se inscreve no canal para não perder nenhum conteúdo sobre programação web e a gente se vê no próximo vídeo valeu
