Flexbox

Qual é a utilidade do flexbox?

• é uma ferramenta criada para estruturar e organizar o site

• é útil para colocar cores e alterar o tamanho da fonte de um texto

• é útil pelo reconhecimento de navegadores e conversão de imagens em vídeos

O que é um elemento?

• O elemento é uma estrutura de imagem que cria um espaço para que o programador coloque alguma informação.

• São as tags que usamos para executar funções. Os elementos podem ficar dentro de um container, em um flexbox.

Um container também pode ser chamado de:

• uma tag

• um elemento pai

• uma expansão

O que a propriedade Justify Content faz?

• Define o tamanho das imagens que forem adicionadas em um container, através da porcentagem do width.

• Define o alinhamento dos ítens ao longo do eixo principal. Também ajuda a distribuir o espaço livre que sobrar no container

• Ela justifica o alinhamento de todas as tags <p> dentro de uma div.

O que faz um display no flexbox?

• Define o comportamento padrão de como flex items são alinhados de acordo com o eixo transversal (cross axis).

• Esta propriedade define o alinhamento dos ítens ao longo do eixo principal.

• A propriedade Display define se um elemento é tratado como um bloco ou elemento embutido/junto.

O que a propriedade Flex Direction faz?

• Com esta propriedade você pode modificar esse comportamento e permitir que os ítens quebrem para uma linha seguinte conforme for necessário.

• Estabelece o eixo principal, definindo assim a direção em que os flex items são alinhados no flex container.

• Determina quais serão os eixos pricipal e transversal do container

Qual é a aplicabilidade da propriedade Align Items?

• Organiza as linhas dentro de um flex container quando há espaço extra no eixo transversal, similar ao modo como justify-content alinha ítens individuais dentro do eixo principal.

• Define o comportamento padrão de como flex items são alinhados de acordo com o eixo transversal (cross axis).

• Determina a ordem em que os elementos aparecerão.

A propriedade align-items pode ter as seguintes configurações:

• 1. stretch, 2. flex-start/ start / self-start, 3. center e 4. baseline

• 1. stretch, 2. center e 3. default

Quais dessas tags *****NÃO***** fazem parte do HTML semântico?

• <header>

  <nav>

  <main>

• <header>

  <doc>

  <main>

• <header>

  <aside>

  <footer>