HTML multi-header table code

HTML multi-header table code
1. Multi-header table code

Copy code
The code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Multiple header tables</title>
<style type="text/css">
body{
width:98%;
height:100%;
font-size:12px;
background-color:#FCF;
text-align:center;
}
#tab{
width:100%;
height:100%;
font-size:12px;
font-family:Verdana, Geneva, sans-serif Georgia, "Times New Roman", Times, serif;
font-weight: bold;
background-color:#9F0;
}
</style>
</head>
<body>
<table id="tab" cellpadding="1" cellspacing="1" border="1">
<tr>
<th rowspan="2">Serial number</th>
<th colspan="2">Wang Wu</th>
<th colspan="2">Li Si</th>
<th colspan="2">Sun Chuan</th>
<th colspan="2">Hu Ping</th>
<th rowspan="2">Total</th>
</tr>
<tr>
<th>Language</th>
<th>Mathematics</th>
<th>Language</th>
<th>Mathematics</th>
<th>Language</th>
<th>Mathematics</th>
<th>Language</th>
<th>Mathematics</th>
</tr>
<tr>
<th>1</th>
<th>78</th>
<th>96</th>
<th>67</th>
<th>98</th>
<th>88</th>
<th>75</th>
<th>94</th>
<th>69</th>
<th> </th>
</tr>
<tr>
<th>2</th>
<th>89</th>
<th>68</th>
<th>77</th>
<th>87</th>
<th>84</th>
<th>76</th>
<th>71</th>
<th>87</th>
<th> </th>
</tr>
<tr>
<th>3</th>
<th>75</th>
<th>78</th>
<th>89</th>
<th>74</th>
<th>65</th>
<th>68</th>
<th>98</th>
<th>90</th>
<th></th>
</tr>
<tr>
<th>4</th>
<th>79</th>
<th>89</th>
<th>65</th>
<th>62</th>
<th>64</th>
<th>87</th>
<th>97</th>
<th>91</th>
<th></th>
</tr>
<tr>
<th>5</th>
<th>89</th>
<th>96</th>
<th>67</th>
<th>76</th>
<th>74</th>
<th>84</th>
<th>67</th>
<th>81</th>
<th></th>
</tr>
<tr>
<th>6</th>
<th>94</th>
<th>90</th>
<th>97</th>
<th>74</th>
<th>62</th>
<th>81</th>
<th>78</th>
<th>78</th>
<th></th>
</tr>
<tr>
<th>7</th>
<th>78</th>
<th>89</th>
<th>77</th>
<th>87</th>
<th>45</th>
<th>86</th>
<th>77</th>
<th>98</th>
<th></th>
</tr>
<tr>
<th>8</th>
<th>65</th>
<th>67</th>
<th>94</th>
<th>68</th>
<th>87</th>
<th>69</th>
<th>78</th>
<th>68</th>
<th></th>
</tr>
<tr>
<th>9</th>
<th>86</th>
<th>98</th>
<th>87</th>
<th>87</th>
<th>65</th>
<th>78</th>
<th>98</th>
<th>79</th>
<th></th>
</tr>
<tr>
<th>10</th>
<th>88</th>
<th>75</th>
<th>77</th>
<th>97</th>
<th>97</th>
<th>77</th>
<th>70</th>
<th>87</th>
<th></th>
</tr>
</table>
</body>
</html>

2. Operation results

<<:  Hidden overhead of Unix/Linux forks

>>:  Search optimization knowledge to pay attention to in web design

Recommend

How to query or obtain images in a private registry

Docker queries or obtains images in a private reg...

Detailed explanation of Angular routing basics

Table of contents 1. Routing related objects 2. L...

The implementation process of extracting oracle data to mysql database

In the migration of Oracle database to MySQL data...

How to query and update the same table in MySQL database at the same time

In ordinary projects, I often encounter this prob...

How to monitor array changes in JavaScript

Preface When introducing defineProperty before, I...

Use momentJs to make a countdown component (example code)

Today I'd like to introduce a countdown made ...

Detailed steps to install MySQL on CentOS 7

In CentOS7, when we install MySQL, MariaDB will b...

Thumbnail hover effect implemented with CSS3

Achieve resultsImplementation Code html <heade...

Two ways to install the Linux subsystem in Windows 10 (with pictures and text)

Windows 10 now supports Linux subsystem, saying g...

React implements dynamic pop-up window component

When we write some UI components, if we don't...

Nginx uses Lua+Redis to dynamically block IP

1. Background In our daily website maintenance, w...

JavaScript adds event listeners to event delegation in batches. Detailed process

1. What is event delegation? Event delegation: Ut...

jQuery achieves full screen scrolling effect

This article example shares the specific code of ...