728x90
반응형
flex
-
[html css] display: flex 속성으로 자식 개체 균등 정렬오늘의 정보 2022. 12. 11. 08:00
display: flex 하위 속성을 정렬하기 위해 부모 객체에 넣어 준다. justify-content : 정렬유형 을 함께 표현 예시) li 를 정렬하기 위해 ul(부모) 에 속성을 넣어 준다. .con1 ul { display: flex; justify-content: space-between; } space-between :처음과 끝은 양끝에 붙이고 나머지 균등 분할 space-around : 객체 양쪽에 빈공간 균등 분할 [ 여백(객체)여백여백(객체)여백 ] 으로 분할되어 객체사이의 거리는 여백2 space-evenly : 모든 빈공간 균등 분할 [ 여백(객체)여백(객체)여백 ]으로 모든 객체 거리가 여백1로 동일