HTML 루비 주석 폴백

HTMLBeginner
지금 연습하기

소개

이 랩에서는 HTML <rp> 태그에 대해 배우게 됩니다. 사용법, 구문 및 기본적인 예제를 살펴볼 것입니다. <rp> 태그는 <ruby> 태그를 지원하지 않는 브라우저를 위한 대체 괄호로 사용됩니다.

참고: index.html에서 코딩을 연습할 수 있으며, Visual Studio Code 에서 HTML 작성 방법을 배울 수 있습니다. 웹 서비스를 포트 8080 에서 실행하려면 오른쪽 하단의 'Go Live'를 클릭하십시오. 그런 다음 Web 8080 탭을 새로 고쳐 웹 페이지를 미리 볼 수 있습니다.

HTML 파일 설정

  1. index.html이라는 HTML 파일을 생성합니다.
  2. body 내에 다음 HTML 코드를 작성합니다.
<h1>HTML Ruby Parentheses</h1>
<p>Example text here.</p>

태그 추가

  1. <p> 태그 아래에 <ruby> 태그를 추가합니다.
  2. <ruby> 태그 내부에 여는 태그와 닫는 태그를 포함하는 <rp> 태그를 추가합니다.
<ruby>
  <rp>(</rp>
  <rt>MTV</rt>
  <rp>)</rp>
</ruby>

글로벌 이벤트 추가

  1. 인라인 스타일과 같은 이벤트 또는 전역 속성을 코드에 추가합니다.
<ruby style="font-size: 18px;">
  <rp>(</rp>
  <rt>MTV</rt>
  <rp>)</rp>
</ruby>
  1. 웹 브라우저에서 index.html 파일을 열어 코드를 확인합니다.

요약

이 랩에서는 HTML <rp> 태그와 해당 구문을 사용하는 방법을 배웠습니다. 또한 <ruby> 태그를 지원하지 않는 브라우저를 위한 대체 괄호를 표시하는 기본적인 예제를 만드는 방법도 배웠습니다. <rp> 태그는 다양한 유형의 브라우저에서 형식이 올바르게 표시되도록 하므로 HTML 에서 중요합니다.