티스토리 뷰

HMLT&CSS&JS/CSS

[css-flex]

turfrain 2022. 8. 11. 11:03

 

Flex Container CSS Flex Items (ie11)
flex-direction: row
(기본값)  order number 0 플렉스 항목의 순서지정 
  column
  flex-grow number 1 아이템 비해 얼마나 커질지
  row-reverse
  flex-shrink number 1 아이템 비해 얼마나 작아질지
  column-reverse
  flex-basis px auto 초기 길이를 지정
flex-wrap:  nowrap
(기본값)   %    
  wrap
  align-self auto   align-items : 설정 재정의
align-content:  normal   (기본값)   stretch
 
  center
    center
 
  flex-start
    flex-start
 
  flex-end
    flex-end
 
  space-around
    baseline
 
  space-between
  flex  initial 0 1 
auto
flex-grow, flex-shrink, flex-basis 약식속성
  stretch
    auto 1 1 
auto
0 은 basis 크기
justify-content:  normal   (기본값)   none 0 0  auto 1 은 듄등 크기
  center
         
   flex-start
         
   flex-end
         
  space-between
         
  space-around
         
  space-evenly
         
align-items:  normal   (기본값)        
  center
         
  flex-start
         
  flex-end
         
  stretch
         
  baseline
         
 
 

'HMLT&CSS&JS > CSS' 카테고리의 다른 글

[CSS] 선언방법  (0) 2024.02.06
[scss]sass  (0) 2021.12.10
CSS3 요소  (0) 2017.05.08
# CSS 말줄임  (0) 2013.07.05
2. 미디어 쿼리  (0) 2012.09.13
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday