# flex box

24개의 포스트

flex box 위치 정하기 힘들 때

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

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

Flex direction

flexbox

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

[SEB FE 44] FLEX BOX

FLEX BOX 실습

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

[💻 코드스테이츠 FE 44기] 부트캠프 - 레이아웃 정렬, 계산기 목업 만들기(디자인)

와이어프레임, 레이아웃 구조, flex box등에 대해 배웠다.오늘 부터 페어 활동으로 다른 수강생분과 2인 1조가 되어 같이 공부하고 해결해 간다. 처음이고 긴장했지만 수강생분들도 다들 처음일 거다. 용기내서 다가기로 하자.웹 또는 애플리케이션을 개발할 때 레이아웃의

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

Layout - Flexbox

레이아웃 배치 기능을 구현할 수 있는 스타일로 기본 축과 교차 축에 따라 요소를 배치한다. flex를 선언하는 상위 부모는 flex container, 하위 요소들은 flex item이라고 불립니다.뷰포트 요소의 크기가 불명확하거나 동적으로 변할 때에도 효율적으로 요소

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

레이아웃(flex-box에 대해서)

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

2022년 12월 25일
·
0개의 댓글
·
post-thumbnail

CSS-flex box

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

2022년 12월 8일
·
0개의 댓글
·
post-thumbnail

08.25 Section 1

학습목표 Flex-box 이해 Flex-box 실습 twittler Flex-box란? Flex-box 박스를 유연하게 늘리거나 줄여 레이아웃을 구성하는 방법 기존의 정렬 방법은 어려웠으나, Flexbox 등장 이후 정렬작업이 용이해짐 Flex-box는 부모

2022년 8월 25일
·
0개의 댓글
·

[CSS] Flex-box 1.

✅ block vs inline CSS를 이용해 Box를 만들면 기본적으로 display: block이 된다. block속성의 특징은 옆으로 무언가가 올 수 없기 때문에 한줄을 다 사용하게 된다. 그에 반해, inline속성은 옆에 무언가를 둘 수 있지만, Box처럼 width나 height을 사용할 수 없다. ✅ Box를 inline처럼 두고 싶을때?...

2022년 3월 26일
·
0개의 댓글
·

Editors in Chrome

미완성 크롬 개발자 도구에서 box-shadow, font-style, flex 쉽게 변경하기

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

TIL 08___CSS basic 4(Flex box)

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

2021년 11월 6일
·
0개의 댓글
·
post-thumbnail

😮 Flex

Flex-box 사용법 정리

2021년 11월 1일
·
0개의 댓글
·

211027 TIL Kakao 앱코딩3 (학습 93일차)

flex-box, align-self

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

211022 TIL Flex-Box (학습 90일차)

flex box model

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

210822 일요일 리마인드 학습

HTML Tag, CSS flex-box

2021년 8월 22일
·
0개의 댓글
·
post-thumbnail

Flex box

flex box 에 대해 공부한걸 간단하게 정리한다.부모 요소 내의 자식 요소들의 정렬에 사용된다.부모 요소 - flex containel자식 요소 - flex item위와 같은 html body가 작성되어 있다고 할 때와 같이 css 코드를 작성하면다음과 같이 핑크색

2021년 8월 14일
·
0개의 댓글
·

TIL[006] 21.03.18

flex-basisflex item의 초기 너비를 지정, 이후 남은 공간은 증가/감소(glow/shrink) 근거로 공간분배flex-glowflex item의 너비를 늘어나도록 정의해 줄 수 있는 속성flex-glow: 1 일 경우 컨테이너 너비에 맞춰 균등하게 배분f

2021년 3월 18일
·
0개의 댓글
·
post-thumbnail

TIL(2021.01.29)

HTML & CSS wireframe , Flex-Box

2021년 1월 31일
·
0개의 댓글
·
post-thumbnail

CSS flex

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

2020년 12월 21일
·
0개의 댓글
·
post-thumbnail

[HTML / CSS] FlexBox 정복하기 3

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

2020년 11월 13일
·
0개의 댓글
·