CSS 소개
CSS는 HTML 요소를 표시하는 방법을 정의하는 데 사용되는 Cascading Style Sheets를 나타냅니다. CSS 스타일은 일반적으로 스타일 시트에 저장되므로 콘텐츠와 표현의 분리 문제를 해결할 수 있습니다. 외부 스타일 시트는 작업 효율성을 크게 향상시킬 수 있습니다.
필요한 지식
계속하기 전에 다음 사항에 대한 기본적인 이해가 필요합니다.
이러한 프로젝트를 먼저 배우고 싶다면 홈페이지에서 관련 튜토리얼을 방문하세요. .
CSS란 무엇인가요?
스타일로 해결
HTML 가능 태그는 원래 문서 내용을 정의하기 위해 설계되었습니다.
,
,
과 같은 태그를 사용하여 HTML의 원래 의도는 "이것은 제목입니다", "이것은 문단입니다", "이것은 표입니다"와 같은 정보를 표현하는 것이었습니다. . 동시에 서식 태그를 사용하지 않고 브라우저에서 문서 레이아웃이 완성됩니다. 두 주요 브라우저(Netscape 및 Internet Explorer)가 HTML 사양에 새로운 HTML 태그 및 속성(예: 글꼴 태그 및 색상 속성)을 계속 추가함에 따라 문서 프리젠테이션과 명확하게 독립적인 문서 콘텐츠를 생성합니다. 사이트 계층이 점점 더 어려워지고 있습니다.
이 문제를 해결하기 위해 비영리 표준화 연합체인 월드와이드웹컨소시엄(W3C)은 HTML 표준화 임무를 맡아 HTML 4.0 이외의 스타일을 만들어냈습니다.
모든 주요 최신 브라우저는 CSS(Cascading Style Sheets)를 지원합니다.
CSS 스타일 시트는 생산성을 크게 향상시킵니다.
스타일 시트는 HTML 3.2의 글꼴 태그 및 색상 속성과 마찬가지로 HTML 요소가 표시되는 방식을 정의합니다. 스타일은 일반적으로 외부 .css 파일에 저장됩니다. 외부 스타일 시트를 사용하면 간단한 CSS 문서를 편집하여 사이트에 있는 모든 페이지의 레이아웃과 모양을 동시에 변경할 수 있습니다.
CSS는 여러 페이지의 스타일과 레이아웃을 동시에 제어할 수 있다는 점에서 웹 디자인 분야의 획기적인 발전이라고 할 수 있습니다. 웹사이트 개발자는 각 HTML 요소의 스타일을 정의하고 이를 원하는 만큼 많은 페이지에 적용할 수 있습니다. 전체 업데이트를 수행하려면 스타일을 변경하기만 하면 사이트의 모든 요소가 자동으로 업데이트됩니다.
여러 스타일이 하나의
스타일 시트에 계단식으로 표시됩니다. 스타일 시트를 사용하면 스타일 정보를 여러 방법으로 지정할 수 있습니다. 스타일은 개별 HTML 요소, HTML 페이지의 헤더 요소 또는 외부 CSS 파일에서 지정할 수 있습니다. 동일한 HTML 문서 내에서 여러 외부 스타일시트를 참조할 수도 있습니다.
계단식 순서
동일한 HTML 요소가 둘 이상의 스타일로 정의된 경우 어떤 스타일이 사용됩니까? ?
일반적으로 모든 스타일은 다음 규칙에 따라 새로운 가상 스타일 시트에 계단식으로 배열되며 4번이 가장 높은 우선순위를 갖습니다.
브라우저 기본 설정
외부 스타일 시트
내부 스타일 시트(<head> 태그 내부에 위치)
인라인 스타일(HTML 요소 내부)
따라서 인라인 스타일(HTML 요소 내부)이 가장 높은 우선순위를 가지며, 이는 <head> 태그, 외부 스타일 시트 또는 브라우저(기본값)의 스타일 선언보다 우선합니다.
