CSS의 스타일 규칙은 무엇입니까?-프런트엔드 Q&A-php.cn

CSS의 스타일 규칙은 무엇입니까?

醉折花枝作酒筹

풀어 주다： 2023-01-06 11:13:20

원래의

9318명이 탐색했습니다.

CSS 스타일 규칙은 선택기와 선언 블록이라는 두 가지 기본 부분으로 구성됩니다. 선택기는 스타일을 적용할 요소를 결정합니다. 선언 블록은 한 쌍의 중괄호 내에 포함되고 하나 이상의 선언으로 구성되는 해당 스타일을 정의하며, 각 선언은 속성과 값으로 구분됩니다. 콜론.

CSS의 스타일 규칙은 무엇입니까?

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

CSS

Cascading Style Sheet의 약자는 CSS인데, English Cascading Style Sheets의 약자입니다. W3C에서 정의하고 유지 관리하는 표준으로, 구조화된 문서(예: HTML 문서 또는 XML 애플리케이션)에 스타일(글꼴, 간격, 색상 등)을 추가하는 데 사용되는 컴퓨터 언어입니다.

개요

웹 페이지의 독자와 작성자 모두 CSS를 사용하여 파일의 색상, 글꼴, 레이아웃 및 기타 표시 특성을 결정할 수 있습니다. CSS의 주요 목적은 파일(HTML 또는 기타 관련 언어로 작성된) 구조를 파일 표시(CSS)와 분리하는 것입니다. 이렇게 분리하면 많은 이점이 있습니다.

파일의 가독성이 향상됩니다
파일 구조가 더욱 유연해집니다
저자와 독자가 파일 표시를 직접 결정할 수 있습니다
구조

CSS는 소리(브라우저에 읽기 기능이 있는 경우)나 시각 장애인을 위한 감각 장치와 같은 다른 표시 방법도 사용할 수 있습니다. 또한 CSS는 XHTML, XML 또는 기타 구조화된 파일과 함께 사용할 수 있으며, 유일한 조건은 해당 파일을 표시하는 브라우저가 CSS를 허용할 수 있어야 한다는 것입니다.

HTML 파일의 각 클래스 또는 ID는 고유한 표시 특성을 가질 수 있으며, ID 특성이 없는 각 HTML 구조도 고유한 표시 특성을 가질 수 있습니다. 이러한 구조 중 일부는 HTML 자체에 필요하며 일부는 CSS용으로 특별히 설정됩니다.

CSS를 사용하면 다음과 같은 장점이 있습니다.

웹사이트 전체 또는 웹페이지 일부의 표시 정보가 한 곳에 집중되어 있어 변경이 매우 편리합니다.
다양한 독자가 가질 수 있습니다. 독자에게는 더 큰 글꼴이 필요합니다
HTML 파일 자체의 범위가 작아지고 구조가 더 단순해지며 표시되는 정보를 포함할 필요가 없습니다

스타일 규칙

구문 CSS는 간단합니다. 다양한 스타일과 특성을 나타내는 영어 단어 그룹을 사용합니다.

스타일시트는 일련의 규칙으로 구성됩니다. 각 규칙은 "선택기"와 정의 부분으로 구성됩니다. 각 정의 섹션에는 세미콜론(;)으로 구분된 정의 세트가 포함되어 있습니다. 이 정의 세트는 한 쌍의 중괄호({ }) 사이에 배치됩니다. 각 정의는 속성, 콜론(:) 및 값으로 구성됩니다.

Selector

일반적으로 ,

, 등의 파일 요소와 HTML의 기타 태그는 반자 쉼표(,)로 구분하여 사용할 수 있습니다.

Property

CSS1, CSS2 및 CSS3은 선택기의 스타일을 제어할 목적으로 많은 속성을 지정합니다.

Value

는 속성에서 허용하는 설정 값을 나타내며, 다양한 키워드로 구성될 수 있습니다. 일반적으로 여러 키워드는 공백으로 구분됩니다.

태그 없이 범위에 스타일을 설정하려면
태그를 사용할 수 있습니다.

CSS 스타일 규칙에 대해 주의해야 할 세 가지 사항이 있습니다:

근접성 원칙

우선순위 관계, 높은 것부터 낮은 것까지: 인라인 스타일 > 내부 스타일 > 외부 스타일.

상속 원칙

상속에서는 패딩, 여백, 배경 등과 같은 테두리 클래스의 대부분 속성을 상속할 수 없습니다.

테이블은 상위 클래스의 스타일을 상속할 수 없습니다.

덮어쓰기 원칙

상속으로 인한 스타일 충돌은 가장 가까운 조상 요소가 차지합니다.

상속된 스타일이 직접 지정된 스타일과 충돌하면 직접 지정된 스타일이 값을 얻습니다.

직접 지정된 스타일이 충돌하는 경우 스타일 가중치가 더 높은 요소가 값을 얻습니다. 스타일 가중치가 동일하면 후자가 값을 얻습니다. 중요한 스타일 속성은 재정의될 수 없습니다.

추천 학습:
css 비디오 튜토리얼

위 내용은 CSS의 스타일 규칙은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!