HTML의 캡션 태그

HTML의 캡션 태그는 테이블과 함께 사용됩니다. 테이블의 제목을 나타내는 데 사용됩니다. 태그는

태그 바로 뒤에 사용됩니다. 한 번에 하나의 캡션 태그만 사용할 수 있습니다. CSS의 도움으로

반응형 웹 디자인 형식의 테이블이 있습니다.

태그는 테이블 본문 내에서 사용됩니다.

다음의 첫 번째 태그로 사용됩니다. 꼬리표. 테이블 행을 생성하고

와 같은 다양한 태그의 조합입니다. 이 태그 중

태그는 테이블 헤드를 생성하는 데 사용되는 테이블을 생성하는 동안 중요합니다.

테이블 컬럼을 생성하기 위한 것입니다.

구문:

• HTML 코드에서 Caption 태그를 정의하는 실제 구문을 살펴보겠습니다.

<caption>title text</caption>

• 위에서 볼 수 있듯이 안에

  태그가 포함되어 있습니다. 꼬리표. 테이블에 제목이 부여됩니다. 그 이후에는 이 캡션 아래에 전체 테이블 데이터가 표시됩니다.

  HTML의 캡션 태그 목록

  • : 테이블에 캡션 추가
  • : 로 묶인 태그 태그
  : 표 머리글, 열, 행을 생성합니다

  HTML에서 캡션 태그를 사용하는 이유는 무엇인가요?

  • 테이블을 사용하여 일부 데이터를 테이블 형식으로 정의할 때마다.
  • 그래서 이 데이터를 고유한 제목을 가진 테이블에 표시하는 것이 사용자의 주요 모토입니다. 이러한 종류의 제목은

  : 캡션 정렬을 설정합니다.

  HTML에 태그를 추가하세요.

  태그 뒤에 있는
  • 맞춤법 검사: 이 속성은 요소의 철자와 문법을 검사함을 나타냅니다.
  • 스타일: 요소에 인라인 CSS 속성을 제공하기 위해 캡션 태그에 사용되는 매우 중요한 속성입니다.
  • translate: 번역 가능 여부와 같은 요소의 세부정보를 제공하는 가장 중요한 속성입니다.

  3. 이벤트 속성: HTML

  의 시작 태그와 끝 태그 사이에 포함됩니다. 하나의 테이블에는 테이블 본문에 캡션 태그가 1개 있어야 합니다.

  HTML에서 캡션 태그 작업

  앞서와 마찬가지로 Table 태그와 함께 caption 태그가 사용된다는 점을 살펴보았습니다. 공통 속성, 글로벌 속성, 이벤트 속성 등 다양한 속성과 함께 사용됩니다.

  이제 이러한 속성이 캡션 태그 작업에 어떻게 도움이 되는지 살펴보겠습니다.

  1. Align: 이 속성은 테이블을 참조하여 캡션을 정렬하기 위해 일부 값과 함께 사용됩니다. 여기에 포함된 값은 왼쪽, 오른쪽, 위쪽, 아래쪽입니다.

  2. 전역 속성: HTML의 전역 속성은

  에서 지원됩니다. 태그.

  • 액세스 키: 이 요소는 일부 특정 요소를 활성화하거나 이에 집중하기 위한 단축키로 작동합니다.
  • dir: 요소 내용의 텍스트에 적절한 방향을 지정하는 데 사용됩니다.
  • class: 클래스 이름은 CSS를 HTML의 특정 요소에 정의하는 데 사용됩니다. 특정 요소에 대해 하나 또는 두 개의 클래스 이름을 사용하고 CSS 속성을 부여할 수 있습니다.
  • contenteditable: 이 속성은 특정 콘텐츠 요소를 편집할 수 있는지 여부를 정의하는 데 사용됩니다.
  • draggable: 사용자가 해당 요소를 드래그할 수 있는지 여부를 정의하는 데 사용됩니다.
  • dropzone: 이 속성은 draggable 속성과 관련이 있습니다. 특정 위치에 요소를 놓을 때 요소를 복사하거나 이동하는 데 사용됩니다.
  • id: 요소에 대한 ID는 특정 요소에 대한 고유 식별 이름을 정의하는 데 사용됩니다.
  • lang:

  콘텐츠가 작성되는 언어를 정의하는 데 사용되는 태그입니다. 문법적으로 철자를 사용하거나

  태그는 다양한 이벤트 속성도 처리하며 다음과 같습니다.

  • onafterprint: This event triggered successfully once the document gets printed.
  • onbeforeprint: This kind of script gets executed before the actual printing of the document.
  • onbeforeunload: This script get executed when our document is getting to be unloaded.
  • onerror: this event attribute is executed when an error occurs in the document.
  • onload: this script generated when the actual loading of the page gets completed.
  • onmessage: whenever a message is triggered, this event occurs.

  Examples of Caption Tag in HTML

  Below given are some examples:

  Example #1

  Here is an example showing how exactly

  tag is going to be used in HTML:

  Code:

  <style>
table,
th,
td {
border: 1px solid blue;
}
#emp_details {
font-size:20px;
color:crimson;
font-style:italic;
}
</style>

  Employee Details

  Firstname	Lastname	EmpId	Age	Designation
Roota	Mittal	9110	32	Marketing Head
John	Roy	9111	28	Sales Head
Dinesh	Shetty	9112	43	Developer
Rucha	Dev	9113	24	Web Developer
Niks	Raw	9114	45	Tester

  Output:

  Example #2

  Here is another example showing how exactly

  tag is going to be used with align attribute with inline CSS, aligning caption to the left :

  Code:

  <style>
table, th, td {
border: 2px solid red;
border-collapse: collapse;
}
</style>

  Maharashtra Elections Results

  Sr No.	Parties	No of seats
1	BJP	104
2	Shiv Sena	56
3	Nationalist Congress Party	54
4	Congress	44
5	Bahujan Vikas Aaghadi	3
6	Muslimeen Prahar Janshkti party	2

  Output:

  Example #3

  This is using an example

  tag to align the title at the right of the table with internal CSS code:

  Code:

  <style>
table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
text-align: center;
}
.india{
text-align: right;
color: blue;
font-weight: bold;
}
</style>

  State & Capitals

  State	Capital
Maharashtra	Mumbai
Goa	Panaji
Assam	Dispur
Haryana	Chandigarh
Kerala	Thriuvanthaouram

  Output:

  Conclusion- Caption Tag in HTML

  From all the above details regarding the caption, the tag explains terms; this is used to give title for the table. The caption is enclosed in between

  tag into the table body. It works on different attributes like align attributes, global attributes, as well as some event, attributes to trigger the event on the caption tag.

위 내용은 HTML의 캡션 태그의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!