h1 제목의 마지막 단어 색상을 변경하는 방법은 무엇입니까?

h1 제목의 마지막 용어 색상을 변경하도록 CSS 수정

웹 사이트 제목의 미적 아름다움을 향상시키는 것은 웹 사이트에서 일반적인 작업입니다. 웹 개발. 이 문의는 h1 제목의 마지막 단어 색상을 변경하는 데 중점을 두고 있습니다.

이를 달성하기 위한 초기 접근 방식에는 범위 요소를 사용하는 것이 포함됩니다.

<h1>main <span>title</span></h1>

별도의 CSS 규칙을 적용하여, 주요 제목과 최종 단어에 다른 색상을 지정할 수 있습니다. 그러나 이 방법에는 추가 HTML 마크업이 도입된다는 단점이 있습니다.

추가 마크업이 필요 없는 대체 솔루션은 lettering.js 라이브러리를 사용하는 것입니다. 이 라이브러리를 사용하면 h1 제목의 마지막 단어를 구체적으로 타겟팅할 수 있는 ::last-word 선택기를 사용할 수 있습니다.

h1 {
  color: #f00;
}

/* Requires lettering.js. Please refer to the article linked below before downvoting. */
h1::last-word {
  color: #00f;
}

lettering.js 라이브러리를 통합하고 ::last- 단어 선택기를 사용하면 추가 마크업 요소를 추가하지 않고도 h1 제목의 마지막 단어 색상을 변경할 수 있습니다.

위 내용은 h1 제목의 마지막 단어 색상을 변경하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!