html table 셀 합치기 (rowspan, colspan)

1. colspan == 컬럼을 합친다.

 

Example.

<table>
	<caption>Life Expectancy By Current Age</caption>
    <tr>
    	<th colspan="2">65</th>
        <th colspan="2">40</th>
        <th colspan="2">20</th>
    </tr>
    <tr>
        <th>Men</th>
        <th>Women</th>
        <th>Men</th>
        <th>Women</th>
        <th>Men</th>
        <th>Women</th>
    </tr>
    <tr>
        <td>82</td>
        <td>85</td>
        <td>78</td>
        <td>82</td>
        <td>77</td>
        <td>81</td>
    </tr>
</table>

Life Expectancy By Current Age

65		40		20
Men	Women	Men	Women	Men	Women
82	85	78	82	77	81

 

 

2. rowspan == 로우를 합친다.

 

Example.

<table>
<caption>Favorite and Least Favorite Things</caption>
<tr> 
  <th></th>
  <th></th> 
  <th>Bob</th>
  <th>Alice</th>
</tr>
<tr>
  <th rowspan="2">Favorite</th>
  <th>Color</th>
  <td>Blue</td>
  <td>Purple</td>
</tr>
<tr>
  <th>Flavor</th>
  <td>Banana</td>
  <td>Chocolate</td>
</tr>
<tr>
  <th rowspan="2">Least Favorite</th>
  <th>Color</th>
  <td>Yellow</td>
  <td>Pink</td>
</tr>
<tr>
  <th>Flavor</th>
  <td>Mint</td>
  <td>Walnut</td>
</tr>
</table>

Favorite and Least Favorite Things

		Bob	Alice
Favorite	Color	Blue	Purple
	Flavor	Banana	Chocolate
Least Favorite	Color	Yellow	Pink
	Flavor	Mint	Walnut