# Flexbox

160개의 포스트
post-thumbnail

Flexbox(2부)

CSS 잼병에서 탈출하기 위한 씨잼탈 1탄 - flex?! flexbox!!! (2부)

2023년 5월 20일
·
0개의 댓글
·
post-thumbnail

Flexbox (1부)

CSS 잼병에서 탈출하기 위한 씨잼탈 1탄 - flex?! flexbox!!! (1부)

2023년 5월 20일
·
0개의 댓글
·
post-thumbnail

CSS : Flexbox (2)

이상태에서 박스들의 width 를 키우면 어떻게 될까?350정도로 해보자안넘치고 그냥 꽉 채워졌다.여기서 Flex-wrap이 등장한다.width가 350만큼 늘어난 대신 아래로 늘어난 것을 확인할 수 있다.flex-wrap 에는 wrap, nowrap, wrap-rev

2023년 5월 11일
·
0개의 댓글
·
post-thumbnail

CSS : Flexbox (1)

요소들을 배치하는 레이아웃 방법 중 하나다. 이게 없기 전에는 배치하기 굉장히 귀찮았다.flexbox는 공간을 동적으로 요소들을 사이즈에 관계없이 배치할 수 있는 강력한 기능을 가지고 있다. 그래서 Flex인것.Flexbox 를 사용하려면 요소들을 flex contai

2023년 5월 10일
·
0개의 댓글
·
post-thumbnail

Project: Mondrian

html Result

2023년 4월 22일
·
0개의 댓글
·
post-thumbnail

Responsiveness

bootstrap result flexbox result grid result media-query Result

2023년 4월 19일
·
0개의 댓글
·
post-thumbnail

발견했다, asc/desc 같은 친구: align-items, justify-content

내 기준 CSS계의 오름/내림차순이 될 것 같은 Flexbox의 "align-items"와 "justify-content" 프로퍼티

2023년 4월 19일
·
0개의 댓글
·
post-thumbnail

flexbox

flexDirectionalignItemsjustifyContent

2023년 4월 18일
·
0개의 댓글
·
post-thumbnail

TIL 5일차 - [HTML/CSS] 계산기 목업 만들기

다른 분들이 만든 계산기 과제들을 보고 어떤 속성들을 사용하여 어떠한 효과들을 내었는지 알아볼 수 있다.backdrop-filter 블러처리하기다른 분들이 공유해준 학습에 좋은 사이트 공유https://cssgridgarden.com/>- https:

2023년 4월 17일
·
0개의 댓글
·
post-thumbnail

Flexbox

01 Flexbox (Flexible Box Module) > flex-direction: row / column; flexbox에서 레이아웃의 방향을 결정하는 속성이다. row가 기본값이며 메인축 즉, 가로축 방향을 설정하고 왼쪽에서 오른쪽으로 item이 정렬된

2023년 4월 17일
·
0개의 댓글
·
post-thumbnail

S1_U4_CH2. Flexbox

코드스테이츠 프론트엔드 개발자 부트캠프 45기 4일차

2023년 4월 14일
·
0개의 댓글
·
post-thumbnail

CSS - 레이아웃

CSS를 통해서 레이아웃을 알아보자

2023년 4월 14일
·
0개의 댓글
·
post-thumbnail

TIL 4일차 - [HTML/CSS] Flexbox

레이아웃을 위한 HTML을 만들 수 있다.display: flex;를 자식 요소가 아닌 부모 요소에 적용해야 함을 이해한다.flex-direction을 이용하여 요소를 정렬할 방향을 결정할 수 있다.justify-content와 align-items를 이용하여 수평-수

2023년 4월 14일
·
0개의 댓글
·

[웹사이트 만들기] Advanced CSS

Flexible Box Layout (flexbox) Transition

2023년 3월 25일
·
0개의 댓글
·
post-thumbnail

HTML/CSS (중급) - 박스 가로배치가 편리한 flexbox

Flexbox 레이아웃 사용법 ⭐⭐⭐ 박스를 감싸는 부모요소에게 display: flex 사용 CSS Flex에 대해 아주 자세히 나와있는 사이트 Flexbox 세부속성 사용하기

2023년 3월 19일
·
0개의 댓글
·

[CSS]border-radius, position

border-radius div로 영역을 만들면 테두리가 네모인 것을 확인할 수 있다. 모서리네모 이 때, border-radius를 이용하면 테두리를 둥글게 만들 수 있다. position "position: absolute" 를 사용할 때 box의 안쪽 기준으로

2023년 3월 10일
·
0개의 댓글
·
post-thumbnail

FlexBox

FlexBox는 말이야

2023년 3월 2일
·
0개의 댓글
·
post-thumbnail

[CSS] position / flexbox

기준 없음 (배치 불가능 / 기본값)자기 자신을 기준으로 해서 포지셔닝을 함. 가장 가까운 조상 요소를 기준으로 배치뷰포트 기준으로 배치스크롤을 따라옴Flexbox는 메인을 이루는 Container와 그 안의 items들로 구성되어있음. !\[https://c

2023년 3월 1일
·
0개의 댓글
·

[SEB_FE_44] 4일차 FLEX

4일차에는 Flexbox에 대해서 자세히 알게 되었다.Flexbox의 flex(flexible)는 "잘 구부러지는, 유연한"이라는 뜻입니다. Flexbox로 레이아웃을 구성한다는 것은, 박스를 유연하게 늘리거나 줄여 레이아웃을 잡는 방법입니다.부모 요소에서 적용해야 하

2023년 2월 17일
·
0개의 댓글
·
post-thumbnail

CSS FLEX박스의 개념과 문법

그동안 flex 박스를 알긴 했지만 개념을 제대로 몰라 야매로 계속 쓰고 있었는데이제 부모 태그와 자식 태그에는 어떤 속성을 사용할 수 있고,다양한 속성들에 대해서 어떻게 사용하는지 개념을 다잡아서 좋다.그리고 페어 시간에 서로 계산기를 만들어보는 것을 코딩하면서상대

2023년 2월 16일
·
0개의 댓글
·