# SESSION ONE | LINGUAGEM DE PROGRAMÇÃO Murillo Tadeu Oliveira | N° - 33 ## CHECK-OUT ### Video 1 ![](https://i.imgur.com/wYSKpvQ.png) ## Resumo ### VIdeo 1 Para usar **Box** precisamos usar primeiro a propriedade: ```````html= display: flex; ```````` Quando usamos essa propriedade ela defini os modos de vizualização do site, e também disponibiliza a utilização de alguns outros comandos como flex-direction e: * flex-direction: row; horizontal * flex-direction: column;vertical * flex-direction: row-reverse; horizontal só que no final da pagina. * flex-direction: column-reverse; vertical só que no final da pagina. A flex-wrap ela define se os filhos vão aceitar ou não uma quebra de conteudo * flex-wrap: wrap; adiciona uma quebra de conteúdo * flex-wrap: no-wrap; ele não irá quebrar o conteúdo * flex-wrap: wrap-reverse; ele adiciona a quebra e muda a ordem dos elementos justify-content * justify-content: flex-start; todos os elementos vão ir do top para esquerda * justify-content: flex-end; vai jogar todos os elementos para o lado superior direito; * justify-content: space-around; que irá ajustar todos os parametros dentro da div * justify-content: space-between; ela irá ajustar do centro as estremidades. aling-itens * aling-itens: flex-start; todos os elementos vão ir do top para esquerda. * aling-itens: flex-end; vai jogar todos os elementos para o lado superior direita. * aling-itens: center; ele irá centralizar todas as divs. * aling-itens: strech; essa propriedade leva todos os registros até o final da div. * aling-itens: baseline; ela adpta o tamanho da div ao tamanho do texto. Flex-grow: Ocupa o resto da largura da div Flex-shrink: Encolhe a div Flex-basic: Define uma largura caso o elemento não tenha ### Video 2 Formas Absolutas: * Pixel(px) * Inches(in) * Centimeters(cm) * Milimeters(mm) * Points(pt) * Picas(pc) Formas Relativas * Percentagem (%) * Font-size(em/rem) * Character-sizes(ex/ch) * Viewport Dimensions(vw/vh) * Viewport max(vnax) * Viewpoint Min(vmin) **Percentagem (%)** - ele corresponde a quantos % você irá retirar dentro de uma outra div.
{"metaMigratedAt":"2023-06-16T02:52:23.467Z","metaMigratedFrom":"Content","title":"SESSION ONE | LINGUAGEM DE PROGRAMÇÃO","breaks":true,"contributors":"[{\"id\":\"ddf4ea40-fb01-4dc1-b147-92a7051a20c0\",\"add\":2130,\"del\":0}]"}
Expand menu