# flex box
flex box 위치 정하기 힘들 때
css 스타일링을 할 때 항상 위치에 대한 고민이 있었다면 아래의 게임을 추천한다. http://www.flexboxdefense.com/css-order 및 flex-direction,justify-content,align-items(self)에 대해서 재미

[💻 코드스테이츠 FE 44기] 부트캠프 - 레이아웃 정렬, 계산기 목업 만들기(디자인)
와이어프레임, 레이아웃 구조, flex box등에 대해 배웠다.오늘 부터 페어 활동으로 다른 수강생분과 2인 1조가 되어 같이 공부하고 해결해 간다. 처음이고 긴장했지만 수강생분들도 다들 처음일 거다. 용기내서 다가기로 하자.웹 또는 애플리케이션을 개발할 때 레이아웃의
Layout - Flexbox
레이아웃 배치 기능을 구현할 수 있는 스타일로 기본 축과 교차 축에 따라 요소를 배치한다. flex를 선언하는 상위 부모는 flex container, 하위 요소들은 flex item이라고 불립니다.뷰포트 요소의 크기가 불명확하거나 동적으로 변할 때에도 효율적으로 요소

레이아웃(flex-box에 대해서)
📂와이어 프레임 📌레이아웃 HTML문서는 기본적인 고유의 스타일을 가지고 있기 때문에, 레이아웃을 잡는데 방해가 되기도 한다. 따라서 기본 스타일링을 제거하고 디자인한 대로 에이아웃을 구현할 수 있는 코드를 추가하는 것이 좋다. 기본 스타일링의 제거하는 cs

CSS-flex box
Flexbox Froggy 게임: https://flexboxfroggy.com/🔗 Resources:Material Design Color Tool:https://material.io/resources/color/CSS Tricks for Flex

08.25 Section 1
학습목표 Flex-box 이해 Flex-box 실습 twittler Flex-box란? Flex-box 박스를 유연하게 늘리거나 줄여 레이아웃을 구성하는 방법 기존의 정렬 방법은 어려웠으나, Flexbox 등장 이후 정렬작업이 용이해짐 Flex-box는 부모
[CSS] Flex-box 1.
✅ block vs inline CSS를 이용해 Box를 만들면 기본적으로 display: block이 된다. block속성의 특징은 옆으로 무언가가 올 수 없기 때문에 한줄을 다 사용하게 된다. 그에 반해, inline속성은 옆에 무언가를 둘 수 있지만, Box처럼 width나 height을 사용할 수 없다. ✅ Box를 inline처럼 두고 싶을때?...

TIL 08___CSS basic 4(Flex box)
* 웹 문서의 전체 배경뿐만 아니라 텍스트, 목록 등 특정한 요소에 배경을 지정하는 방법 등에 대해 알아본다. 1. 배경색을 지정하는 background-color 속성 색상을 세밀히 조절하고 싶다면 16진수값을, 투명도도 함께 조절하고 싶다면 rgba표기법을 사용

Flex box
flex box 에 대해 공부한걸 간단하게 정리한다.부모 요소 내의 자식 요소들의 정렬에 사용된다.부모 요소 - flex containel자식 요소 - flex item위와 같은 html body가 작성되어 있다고 할 때와 같이 css 코드를 작성하면다음과 같이 핑크색
TIL[006] 21.03.18
flex-basisflex item의 초기 너비를 지정, 이후 남은 공간은 증가/감소(glow/shrink) 근거로 공간분배flex-glowflex item의 너비를 늘어나도록 정의해 줄 수 있는 속성flex-glow: 1 일 경우 컨테이너 너비에 맞춰 균등하게 배분f

CSS flex
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. flex-box 수평, 수직 정렬과 관련된 속성 (container, item로 이루어짐) display: flex : container가 block (flex container로 정의함!) di

[HTML / CSS] FlexBox 정복하기 3
flex-grow flex-shrink flex-basishtml 파일 css파일 flex-grow와 flex-shrink는 브라우저 창의 크기에 따라 요소의 크기를 변화 시켜준다. 이름에서 유추할 수 있듯, flex-grow는 창 크기가 커질때, flex-shrink