# Flexbox
CSS : Flexbox (2)
이상태에서 박스들의 width 를 키우면 어떻게 될까?350정도로 해보자안넘치고 그냥 꽉 채워졌다.여기서 Flex-wrap이 등장한다.width가 350만큼 늘어난 대신 아래로 늘어난 것을 확인할 수 있다.flex-wrap 에는 wrap, nowrap, wrap-rev
CSS : Flexbox (1)
요소들을 배치하는 레이아웃 방법 중 하나다. 이게 없기 전에는 배치하기 굉장히 귀찮았다.flexbox는 공간을 동적으로 요소들을 사이즈에 관계없이 배치할 수 있는 강력한 기능을 가지고 있다. 그래서 Flex인것.Flexbox 를 사용하려면 요소들을 flex contai
발견했다, asc/desc 같은 친구: align-items, justify-content
내 기준 CSS계의 오름/내림차순이 될 것 같은 Flexbox의 "align-items"와 "justify-content" 프로퍼티
TIL 5일차 - [HTML/CSS] 계산기 목업 만들기
다른 분들이 만든 계산기 과제들을 보고 어떤 속성들을 사용하여 어떠한 효과들을 내었는지 알아볼 수 있다.backdrop-filter 블러처리하기다른 분들이 공유해준 학습에 좋은 사이트 공유https://cssgridgarden.com/>- https:
Flexbox
01 Flexbox (Flexible Box Module) > flex-direction: row / column; flexbox에서 레이아웃의 방향을 결정하는 속성이다. row가 기본값이며 메인축 즉, 가로축 방향을 설정하고 왼쪽에서 오른쪽으로 item이 정렬된
TIL 4일차 - [HTML/CSS] Flexbox
레이아웃을 위한 HTML을 만들 수 있다.display: flex;를 자식 요소가 아닌 부모 요소에 적용해야 함을 이해한다.flex-direction을 이용하여 요소를 정렬할 방향을 결정할 수 있다.justify-content와 align-items를 이용하여 수평-수
HTML/CSS (중급) - 박스 가로배치가 편리한 flexbox
Flexbox 레이아웃 사용법 ⭐⭐⭐ 박스를 감싸는 부모요소에게 display: flex 사용 CSS Flex에 대해 아주 자세히 나와있는 사이트 Flexbox 세부속성 사용하기
[CSS]border-radius, position
border-radius div로 영역을 만들면 테두리가 네모인 것을 확인할 수 있다. 모서리네모 이 때, border-radius를 이용하면 테두리를 둥글게 만들 수 있다. position "position: absolute" 를 사용할 때 box의 안쪽 기준으로
[CSS] position / flexbox
기준 없음 (배치 불가능 / 기본값)자기 자신을 기준으로 해서 포지셔닝을 함. 가장 가까운 조상 요소를 기준으로 배치뷰포트 기준으로 배치스크롤을 따라옴Flexbox는 메인을 이루는 Container와 그 안의 items들로 구성되어있음. !\[https://c
[SEB_FE_44] 4일차 FLEX
4일차에는 Flexbox에 대해서 자세히 알게 되었다.Flexbox의 flex(flexible)는 "잘 구부러지는, 유연한"이라는 뜻입니다. Flexbox로 레이아웃을 구성한다는 것은, 박스를 유연하게 늘리거나 줄여 레이아웃을 잡는 방법입니다.부모 요소에서 적용해야 하
CSS FLEX박스의 개념과 문법
그동안 flex 박스를 알긴 했지만 개념을 제대로 몰라 야매로 계속 쓰고 있었는데이제 부모 태그와 자식 태그에는 어떤 속성을 사용할 수 있고,다양한 속성들에 대해서 어떻게 사용하는지 개념을 다잡아서 좋다.그리고 페어 시간에 서로 계산기를 만들어보는 것을 코딩하면서상대