[HTML mdn web docs] table 의 th에 id 쓰는 법

 

 

 

intellij 에서 테이블만 만들면 자꾸 th에 id나 scope attribute를 넣어라고 한다

왜 일까... 🤔

 

 

 

 

 

Table에서 id와 headers 속성을 이용하여 연결을 만든다

 

 

<thead>
  <tr>
    <th id="purchase">Purchase</th>
    <th id="location">Location</th>
    <th id="date">Date</th>
    <th id="evaluation">Evaluation</th>
    <th id="cost">Cost (€)</th>
  </tr>
</thead>
<tbody>
  <tr>
    <th id="haircut">Haircut</th>
    <td headers="location haircut">Hairdresser</td>
    <td headers="date haircut">12/09</td>
    <td headers="evaluation haircut">Great idea</td>
    <td headers="cost haircut">30</td>
  </tr>

  …
</tbody>

 

th 에 id를 추가해주고

td 는 headers 요소를 추가하고 공백으로 구분하는 것이다

 

제대로 작동하려면 테이블에 열과 행 머리글이 모두 필요하다.

 

 

 

 

 

https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html

Planets data

 

Planets data

Data about the planets of our solar system (Planetary facts taken from Nasa's Planetary Fact Sheet - Metric).

		Name	Mass (1024kg)	Diameter (km)	Density (kg/m3)	Gravity (m/s2)	Length of day (hours)	Distance from Sun (106km)	Mean temperature (°C)	Number of moons	Notes
Terrestrial planets		Mercury	0.330	4,879	5427	3.7	4222.6	57.9	167	0	Closest to the Sun
		Venus	4.87	12,104	5243	8.9	2802.0	108.2	464	0
		Earth	5.97	12,756	5514	9.8	24.0	149.6	15	1	Our world
		Mars	0.642	6,792	3933	3.7	24.7	227.9	-65	2	The red planet
Jovian planets	Gas giants	Jupiter	1898	142,984	1326	23.1	9.9	778.6	-110	67	The largest planet
		Saturn	568	120,536	687	9.0	10.7	1433.5	-140	62
	Ice giants	Uranus	86.8	51,118	1271	8.7	17.2	2872.5	-195	27
		Neptune	102	49,528	1638	11.0	16.1	4495.1	-200	14
Dwarf planets		Pluto	0.0146	2,370	2095	0.7	153.3	5906.4	-225	5	Declassified as a planet in 2006, but this remains controversial.