공부방2022. 11. 14. 14:03css(17) text-transform
text-transform : 입력된 글자들을 대문자 또는 소문자로 변경 1. none : 입력된 그대로 출력 2. capitalize : 단어의 첫번째 글자를 대문자로 바꿈 3. uppercase : 모든 글자를 대문자로 바꿈 4. lowercase : 모든 글자를 소문자로 바꿈 5. initial : 기본값으로 설정 6. inherit : 부모 요소의 속성값을 상속받음 See the Pen Untitled by magic (@mag11c) on CodePen.
공부방2022. 11. 13. 11:53css(16) flexable box layout (flex)
플렉서블 박스 레이아웃 - 플렉스박스 혹은 플렉스라고 부르며 CSS3부터 나온 레이아웃 모델 - 해당 요소의 display 속성을 설정함으로써 시작(dlsplay:flex, inline:flex) - 플렉스는 오직 플렉스 요소가 컨테이너 내부에서 어떻게 위치하는가만 정의하기 때문에 요소 내부의 스타일은 평소처럼 동작한다 1. flex-direction - 플렉스 컨테이너 내부에서 플렉스 요소가 배치될 방향을 설정 ⓐ row : 기본값, 플렉스 아이템들은 왼쪽에서 오른쪽으로, 위에서 아래로 배치 ⓑ row-reverse : 플렉스 아이템을 오른쪽에서 왼쪽으로 배치 ⓒ column : 위에서 아래로 ⓓ column-reverse : 아래에서 위로 2. justify-content - 플렉스 아이템의 수평방향..