ucong97

white-space - 스페이스와 탭, 줄바꿈, 자동줄바꿈을 어떻게 처리할지 결정 스페이스와 탭 줄바꿈 자동줄바꿈 normal 병합 병합 O nowrap 병합 병합 X pre 보존 보존 X pre-wrap 보전 보존 O pre-line 병합 보존 O

transform - 요소에 회전, 크기조절, 기울이기, 이동.효과 부여 가능 ex) CSS div{ transform:translateX(길이1) translateY(길이2); } - 길이1이 양수일경우 : 오른쪽으로 이동 / 음수일경우 : 왼쪽으로 이동 - 길이2이 양수일경우 : 아래로 이동 / 음수일경우 : 위로 이동

z-index - 요소들의 수직 위치를 정한다. - 값은 정수로 숫자가 클수록 위로 올라온다.

position - 태그들의 위치를 결정 absolute, fixed relative static 너비 최대한 줄어든다 그대로 유지 그대로 유지 본질 유령화, 유령의 집화 유령의 집화 사람화 겹침허용 가능 불가능 불가능 이동 top, left, right, bottom - - * fixed - 스크롤바 따라다님

none - 사라짐 ex) HTML 유콩 ex) CSS div{ display:none; } ex) VIEW

목록태그 - ul (목록) - 순서가 없는 목록 / li들의 부모 - ol (목록) - 순서가 있는 목록 / li들의 부모 - li (항목) - ul의 구성요소, ul의 자식은 무조건 li HTML VIEW 내용1 내용2 내용3 내용4 ㆍ내용1 ㆍ내용2 ㆍ내용3 ㆍ내용4 내용1 내용2 내용3 내용4 1. 내용1 2. 내용2 3. 내용3 4. 내용4

제목태그 - h1, h2, h3, h4, h5, h6 - 문서 구조와 밀접한 관련이 있으므로 순서에 맞게 사용 HTML VIEW 제목1 제목2 제목3 제목4 제목5 제목6 제목1 제목2 제목3 제목4 제목5 제목6

선택자 - 선택을 해주는 요소 - 선택자로 특정 요소들을 선택해 스타일 적용 - 태그선택자 div{ ... } - 자식선택자 div>a{ ... } - 후손선택자 div a{ ... } - 클래스 선택자 .div{ ... } - 아이디 선택자 #div{ ... }

클래스 - 요소에 스타일 시트를 적용하기 위한 구분자 ex) HTML 내용 // 한요소에 하나만 넣는경우 내용 // 한 요소에 여러개 넣는 경우 * 클래스명 띄어쓰기금지 - 두개로 인식 ex) CSS .a{ ... } .a.b{ .... }

노말라이즈 - 해당 엘리먼트에 기본적으로 적용되어 있는 디자인을 없애서 다시 평범하게 만드는 것 - a, body, ul, li, ol, li, h1~h6 은 사용전에 노말라이즈를 해줘야 한다. body bady{ margin:0; } a a{ color:inherit; text-decoration:none; } h1, h2, h3, h4, h5, h6 h1{ marginb:0; } ul, ol, li ul, ol, li{ list-style:none; // 기호없애기 padding:0; margin:0; }