IT 정보/기타 정보
[HTML/CSS] HTML , CSS 는 무엇인가!? (3편) - flexbox!
개발하는 동그리
2022. 4. 28. 11:43
반응형
Container (사용할 수 있는 속성 값)
- display : flex;
- flex-direction : (default)row, row-reverse, column, column-reverse
- frex-wrap : (default)nowrap, wrap (reverse 사용가능) ---> 화면에 꽉 차면 다음줄로 넘기는 여부
- flex-flow : column wrap;
- justify-content : flex-start, flex-end, flex-center, space-around, space-evenly, space-between
Item (지정할 수 있는 속성 값)
- order : 1; --> item의 순서 변경 가능
- flex-grow : (default) 0;
- flex-shrink : (default) 0;
- flex-basis : (defalt) auto; , 할당 % 사용가능
- flex : (grow) (shrink) (basis); --> 3가지를 한번에 입력할 수 있음
Frontend, CSS, Flex 관련 참고 영상 첨부 (매우 이해가 잘 됨)
1편이 궁금하시다면 ~
https://choonsik-lab.tistory.com/entry/HTML-HighperText-Markup-language
HTML , CSS 는 무엇인가!? (1편) - HTML
html 기본 구조 <!DOCTYPE html> 메인 제목 내용 HTML CSS Javascript 주요 기능 web site 뼈대 구성 (Structure) html 스타일 구성 기능 구현 (상호 작용) HTML은 위에 보이는 코드처럼 Structure를 구성하는..
choonsik-lab.tistory.com
2편이 궁금하시다면 ~
HTML , CSS 는 무엇인가!? (2편) - CSS
CSS 는 무엇인가? CSS (Cascading Style Sheets)의 약자로 문서에 디자인을 입힐 때 사용하는 스타일 시트 언어다. CSS 가 필요한 이유? HTML에서 디자인을 입히는 것보다 CSS를 따로 구현해서 관리한다는 점
choonsik-lab.tistory.com
반응형