# CSS flex

10개의 포스트
post-thumbnail

TIL - CSS flex, grid

Flex(Flexible) : "유연한"display : flexblock 특성의 flex container를 정의flex-direction아이템을 가로정렬 or 세로정렬할지 설정flex-wrapflex-flow : flex-direction값 flex-wrap값;di

2022년 5월 4일
·
0개의 댓글
·
post-thumbnail

[SeSAC DT 과정] CSS - flex 단축 속성

flex는 flex-grow, flex-shrink, flex-basis의 단축 속성! ⭐️ 참고사이트이 3가지 속성은 따로 쓰지 않고, 대체로 flex 단축 속성으로 작성한다.flex container의 남은 너비를 flex item들이 어떻게 나눠가질 것인지를 지

2022년 2월 28일
·
0개의 댓글
·
post-thumbnail

[SeSAC DT 과정] HTML video, audio 태그 / CSS flex, filter

비디오파일, 오디오파일을 문서에 삽입할 때 사용형식(audio태그도 동일)속성값🐸 flex 속성 연습 게임(https://flexboxfroggy.com/보다 쉬운 레이아웃 배치를 위해 css3에 새롭게 추가된 display 속성형식 Display: fle

2022년 1월 4일
·
0개의 댓글
·

다양한 css 활용법

css, flex

2021년 12월 28일
·
0개의 댓글
·
post-thumbnail

[CSS 기초] Flex

라고 하면 div(block 요소)기 때문에 수직 정렬을 하게 된다. 수평 정렬을 하고 싶다면? 요소를 주면 수평으로 정렬된 것 같이 보이지만, 요소들간의 간격으로 인해 여백이 존재한다. (개행이 있으면 여백이 생긴다.) 하면 둥둥 부유하게 되어서 수평으로 잘 된

2021년 10월 5일
·
0개의 댓글
·

[study] CSS 변환과 애니메이션

Transform 다른 요소들에 영향을 주지 않는다. transform:scale(); 크기 transform:rotate(deg); 회전 transform:skew(deg);skewX(deg);skewY(deg); 비틀기 transform:translate(x,y)

2021년 4월 7일
·
0개의 댓글
·
post-thumbnail

CSS - Flex(2)

flex-basis ( 유연한 박스의 기본 영역 ): Flex Item의 기본 크기를 설정합니다. (flex-direction이 row -> width                                                                  

2020년 9월 23일
·
0개의 댓글
·
post-thumbnail

CSS - Flex (1)

(본 글은 1분코딩님의 https://studiomeal.com/archives/197를 참조하였습니다.)1차원적인 레이아웃 배치 전용 기능으로 고안되었다Flexible Box / Flexbox라고 부르기도 한다상위 모듈로는 2차원적인 레이아웃 배치를 하는 G

2020년 9월 22일
·
0개의 댓글
·

Til 07.29 css flex박스

css Flex css flex는 선택자에 display의 값을 flex를 줘서 선언한다. css flex에서는 두 가지 중요한 개념이 있다. > 1. flex의 속성값은 두 가지로 나뉘는데 하나는 container를 움직이는 속성 그리고 container 안에 있

2020년 7월 29일
·
0개의 댓글
·

[Tutorial] CSS flex & CSS grid

※ 출처: CSS flex※ 출처: CSS grid

2020년 2월 20일
·
0개의 댓글
·