HTML에서 동일한 클래스 이름을 가진 다른 요소에 CSS 스타일을 적용하는 방법은 무엇입니까?

HTML 클래스는 본질적으로 대소문자를 구분하는 클래스 목록을 지정하기 위해 HTML 태그에서 사용되는 전역 속성입니다. 그런 다음 이러한 클래스는 CSS에서 해당 클래스를 사용하여 특정 태그에 스타일을 적용하고 Javascript에서 HTML 요소의 동작, 상호 작용 또는 스타일을 조작하는 데 사용됩니다.

방법 1; 점(.) 선택기를 사용하세요

이 방법에서는 간단히 점(.) 선택기를 사용하여 동일한 클래스 이름을 가진 여러 요소를 선택하고 CSS를 사용하여 동일한 스타일 세트를 해당 요소에 적용합니다.

예

이 예에서는 클래스를 사용하여 "p" 태그와 "span" HTML 태그를 선택하고 CSS를 사용하여 텍스트 색상 "red"를 할당합니다.

으아아아

방법 2: “p” 태그 및 “span” HTML 태그 사용

이 방법에서는 CSS를 사용하여 동일한 클래스 이름을 가진 요소에 다양한 스타일 세트를 적용합니다. 이를 위해 HTML 태그 이름 뒤에 점(.) 선택기를 사용하여 특정 요소를 선택하고 필요한 CSS 스타일을 지정합니다.

예

이 예에서는 클래스를 사용하여 "p" 태그와 "span" HTML 태그를 선택하고 CSS를 사용하여 서로 다른 텍스트 색상을 지정합니다.

으아아아

결론

이 글에서는 클래스 이름에서 HTML 요소를 선택하는 방법과 두 가지 방법을 사용하여 동일하거나 다른 CSS 스타일을 해당 요소에 적용하는 방법을 배웠습니다. 첫 번째 방법에서는 점(.) 선택기를 사용하여 동일한 클래스 이름을 가진 여러 요소를 선택하고 동일한 스타일을 적용합니다. 두 번째 방법에서는 HTML 태그 이름 뒤에 점(.) 선택기를 사용하여 동일한 클래스 이름을 가진 요소에 다른 CSS 스타일을 적용합니다.

위 내용은 HTML에서 동일한 클래스 이름을 가진 다른 요소에 CSS 스타일을 적용하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!