>  기사  >  웹 프론트엔드  >  CSS 클래스는 무엇을 의미하나요?

CSS 클래스는 무엇을 의미하나요?

藏色散人
藏色散人원래의
2021-01-11 09:20:386325검색

css 클래스는 지정된 클래스가 있는 요소를 선택하는 데 사용되는 클래스 선택기를 의미하며, 클래스 선택기는 점으로 표시되며 사용 구문은 ".center {text-align: center}"와 같습니다. 중앙 클래스가 있는 모든 HTML 요소는 모두 중앙에 배치됩니다.

CSS 클래스는 무엇을 의미하나요?

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

권장: css 비디오 튜토리얼

CSS에서 클래스는 지정된 클래스(클래스)가 있는 요소를 선택하는 데 사용되는 클래스 선택기를 의미합니다. 클래스 선택기는 점으로 표시됩니다(예: ".center"). .

.center {text-align: center}

위의 예에서는 center 클래스가 있는 모든 HTML 요소가 중앙에 배치됩니다.

아래 HTML 코드에서 h1과 p 요소 모두 중앙 클래스를 갖습니다. 이는 둘 다 ".center" 선택기의 규칙을 준수한다는 것을 의미합니다.

<h1 class="center">
This heading will be center-aligned
</h1>
<p class="center">
This paragraph will also be center-aligned.
</p>

참고: 클래스 이름의 첫 번째 문자로 숫자를 사용할 수 없습니다! Mozilla나 Firefox에서는 작동하지 않습니다.

id와 마찬가지로 클래스도 파생 선택기로 사용할 수 있습니다.

.fancy td {
color: #f60;
background: #666;
}

위의 예에서 클래스 이름이 fancy인 더 큰 요소 내부의 테이블 셀은 회색 배경에 주황색 텍스트를 표시합니다. (fancy라는 이름의 더 큰 요소는 테이블이나 div일 수 있습니다.)

요소는 클래스에 따라 선택할 수도 있습니다.

td.fancy {
color: #f60;
background: #666;
}
<td class="fancy">

위 예에서 클래스 이름이 fancy인 테이블 셀은 회색 배경의 주황색입니다.

위 내용은 CSS 클래스는 무엇을 의미하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.