선택자{속성: 속성값;}선택자 : 디자인을 적용할 영역속성 : 어떤 디자인을 적용할지 정의 속성값 : 어떤 역할을 수행할지 정의 inline style sheet태그 안에 직접 작성 internal style sheet 스타일 태그안에 작성external style
선택한 요소의 넓이 설정 고정값 (%), 가변값(px)선택한 요소의 높이 설정font-family: 글꼴 font-weight: 글자 두께font-size: 글자 크기font-style: 글자 기울기border-style: 테두리 스타일(solid, dotted)bor
margin 요소의 네 방향 바깥 여백 영역을 설정 margin-top, margin-right, margin-bottom, margin-left 속성값이 auto면 자동으로 좌우 혹은 상하를 맞춘다는 뜻 한줄로 작성 가능 > padding 요소의 네 방향
요소의 크기,위치,모양을 변경하는 속성ratate(45deg): 회전scale(2,3):width,height을 확대 혹은 축소skew(10deg,20deg): x축,y축을 기준으로 입력한 각도만큼 비틈translate(100px,200px): 위치 변경다른 버전의 브
모든 기기에 대응되는 반응형 웹사이트를 만들 때 사용되는 CSS구문미디어쿼리가 제대로 작동하지 않는 문제를 방지하기 위해 viewport로 너비와 배율을 설정해야 함head 태그 안에 작성미디어쿼리안에 작성되지 않은 속성은 미디어쿼리 외부 영역에 있는 CSS속성을 상속
1. flex item의 방향과 순서 flex 하나의 플렉스 아이템이 자신의 컨테이너가 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성 display: flex;적용으로 시작 flex-directrion: 플렉스 아이템의 방향을 제어 flex