프로그램 이론/CSS (3) 썸네일형 리스트형 [CSS]자유롭고 창의적인 디자인 기법(CSS) - 3 1. CSS 속성 1-1. 박스 모델(Box Model) - 박스 모델은 CSS의 중요한 개념으로 블록 박스와 인라인 박스가 화면에 표시되는 영역과 다른 박스와의 배체 등에 대한 내용을 담고 있습니다. - 특히 화면에 표시되는 박스의 크기를 결정할 때 width, height, border, margin, padding 등의 속성을 사용할 수 있는데, 박스의 크기는 다음의 계산식을 통해 결정됩니다. - 실제 화면에 차지하는 가로 영역 크기 계산식 - width + margin + border + padding - 실제 화면에 차지하는 세로 영역 크기 계산식 - height + margin + border + padding - width : 콘텐츠의 가로 크기 - height : 콘텐츠의 세로 크기 - b.. [CSS]자유롭고 창의적인 디자인 기법(CSS) - 2 1. CSS 선택자 1-1. Type 선택자 1-2. 전체 선택자 1-3. class와 id 선택자 1-4. 속성(attribuet) 선택자 1-5. 가상 요소와 가상 클래스 1-6. 선택자 조합 1-7. 하위 선택자 1-8. 자식 선택자 1-9. 인접 형제 선택자 1-10. 선택자 그룹화2. CSS 개념 및 단위 - 상속 - 하위 요소가 상위 요소의 사용값을 물려 받느냐 아니냐를 타나내는 것 - 이러한 값의 상속은 상속되는 것이 있고 안되는 것이 있음 - 값이 자동으로 자식 요소에 상속되지 않는 경우 inherit 키워드를 이용하여 강제로 상속시킬 수 있음 - 상속된 스타일을 재정의하고 싶다면 원하는 선택자에게 적용을 원하는 스타일을 정의 - 겹침(Cascading) - 우선순위 - 스타일의 충돌 : .. [CSS]자유롭고 창의적인 디자인 기법(CSS) - 1 1. CSS란? - CSS는 웹 페이지에 디자인이라는 시각적인 가치를 부여하기 위한 언어입니다. - CSS는 HTML의 Presentation 모듈을 대체하는 언어로서 개발되었습니다. - CSS의 표준 : Level CSS 2.1 - 대다수의 웹 브라우저는 CSS 2.1를 지원합니다. - 인터넷 익스플로러의 경우 버전 7부터 CSS2.1 표준을 지원하기 시작했습니다. - W3C에서는 CSS 3를 향후 표준화 하기 위해 노력하고 있습니다. 2. CSS 서식 - Rule Set 3. CSS 적용하기 4. 외부 스타일 시트(External Style Sheet) - CSS 파일을 독립적으로 생성하여 웹 문서에 삽입하는 방법을 외부 스타일시트라고 합니다. 5. 내부 스타일시트(Internal Style Shee.. 이전 1 다음