[패스트캠퍼스 수강 후기] 프론트엔드 인강 100% 환급 챌린지 27회차 미션

9 * 3 = 27

패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 27일차입니다!

오늘부터 8번째 커리큘럼, 'HTML/요소- 표 콘텐츠 & 양식' 공부를 끝냈습니다.

3개 강의 중 2개 강의에서 설명된 태그는 처음 알게된 것들이고 (<col>은 실무에서 써봤던 것 같기도 하고...)

나머지 1개 강의에서 설명된 태그의 쓰임새에 대해서는 정확하게 배웠습니다.

 

오늘은 04~06. 표 콘텐츠 - CAPTION / COLGROUP,COL / THEAD, TBODY, TFOOT 에 대하여 학습했어요.

---

<Today I Learned>

<caption>

🔸 표의 제목을 설정함

🔸 열리는 <table> 태그 바로 다음에 작성함

🔸 <table> 당 하나의 <caption>만 사용 가능함

 

<colgroup>

🔸 표의 전체 열에 대한 공통 정의

🔹 <colgroup> 안에 <col> 태그 작성 

 

<col>

🔸 빈 태그

🔸 표의 열을 공통 정의

🔸 속성 span: 연속되는 열 수, 기본값=1,

🔹 속성 span 값이 2 이상일 때, span을 명시해준 첫 번째 <col>만 명시해주면 됨

 

<colgroup>
    <col>
    <col span="2" style="background-color: tomato;">
    <!-- 2~3번째 열의 배경색상이 토마토 -->
</colgroup>

<thead>, <tbody>, <tfoot>

🔸 차례로 표의 머리 부분, 몸통 부분, 바닥 부분을 의미

🔸 의미론적으로만 사용됨, 태그 구분용!

---

학습 내용 출처 : https://heropy.blog/2019/05/26/html-elements/

한눈에 보는 HTML 요소(Elements & Attributes) 총정리

강의 링크: https://bit.ly/3m0t8GM