<html>
<head>
<title>tab1.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
每个表格从一个 table 标签开始。
每个表格行从 tr 标签开始。
每个表格的数据从 td 标签开始。
border代表的意思是表格线的宽度
p>
<h4>一列:h4>
<table border="1">
<tr>
<td>100td>
tr>
table>
<h4>一行三列:h4>
<table border="1">
<tr>
<td>100td>
<td>200td>
<td>300td>
tr>
table>
<h4>两行三列:h4>
<table border="1">
<tr>
<td>100td>
<td>200td>
<td>300td>
tr>
<tr>
<td>400td>
<td>500td>
<td>600td>
tr>
table>
<h4>两行三列:h4>
<table border="1">
<tr>
<td>100td>
<td>200td>
<td>300td>
tr>
<tr>
<td>400td>
<td>500td>
<td>600td>
tr>
table>
<h4>三行三列h4>
<table border="2">
<tr>
<td>用户名td>
<td>密码td>
<td>性别td>
tr>
<tr>
<td>年龄td>
<td>邮箱td>
<td>手机号td>
tr>
<tr>
<td>出生年月td>
<td>毕业院校td>
<td>毕业时间td>
tr>
table>
body>
html>
<html>
<head>
<title>tab1.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
没有边框的表格的两种表现形式
p>
<h4>这个表格没有边框:h4>
<table>
<tr>
<td>100td>
<td>200td>
<td>300td>
tr>
<tr>
<td>400td>
<td>500td>
<td>600td>
tr>
table>
<h4>这个表格没有边框:h4>
<table border="0">
<tr>
<td>100td>
<td>200td>
<td>300td>
tr>
<tr>
<td>400td>
<td>500td>
<td>600td>
tr>
table>
body>
html>
<html>
<head>
<title>tab1.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
th表格的头
有垂直以及水平的
p>
<h4>水平标题:h4>
<table border="1">
<tr>
<th>Nameth>
<th>Telephoneth>
<th>Telephoneth>
tr>
<tr>
<td>Bill Gatestd>
<td>555 77 854td>
<td>555 77 855td>
tr>
table>
<h4>垂直标题:h4>
<table border="1">
<tr>
<th>First Name:th>
<td>Bill Gatestd>
tr>
<tr>
<th>Telephone:th>
<td>555 77 854td>
tr>
<tr>
<th>Telephone:th>
<td>555 77 855td>
tr>
table>
<h4>综合:h4>
<table border="1">
<tr>
<th>th>
<th>Telephoneth>
<th>Telephoneth>
tr>
<tr>
<th>First Name:th>
<td>Bill Gatestd>
tr>
<tr>
<th>Telephone:th>
<td>555 77 854td>
tr>
<tr>
<th>Telephone:th>
<td>555 77 855td>
tr>
table>
body>
html>
<html>
<head>
<title>tab1.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
带有标题的表格
caption标题标签
p>
<table border="1">
<caption>Monthly savingscaption>
<tr>
<th>Monthth>
<th>Savingsth>
tr>
<tr>
<td>Januarytd>
<td>$100td>
tr>
<tr>
<td>Februarytd>
<td>$50td>
tr>
table>
body>
html>
<html>
<head>
<title>tab1.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
跨行跨列的表格单元格
th 属性 colspan跨两行
th 属性 rowspan跨两列
p>
<h4>单元格跨两格:h4>
<table border="1">
<tr>
<th>Nameth>
<th colspan="2">Telephoneth>
tr>
<tr>
<td>Bill Gatestd>
<td>555 77 854td>
<td>555 77 855td>
tr>
table>
<h4>单元格跨两列:h4>
<table border="1">
<tr>
<th>First Name:th>
<td>Bill Gatestd>
tr>
<tr>
<th rowspan="2">Telephone:th>
<td>555 77 854td>
tr>
<tr>
<td>555 77 855td>
tr>
table>
body>
html>
<html>
<head>
<title>tab6.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>表格的复杂形式,表格中添加复杂的元素 例如:表格嵌套表格,表格嵌套列表等复杂的元素
ul是列表,li无序列表
tr 行
p>
<table border="1">
<tr>
<td>
<p>这是一个段落p>
<p>这是另一个段落p>td>
<td>这个单元格包含一个表格:
<table border="1">
<tr>
<td>Atd>
<td>Btd>
tr>
<tr>
<td>Ctd>
<td>Dtd>
tr>
table>td>
tr>
<tr>
<td>这个单元格包含一个列表
<ul>
<li>applesli>
<li>bananasli>
<li>pineapplesli>
ul>td>
<td>HELLOtd>
tr>
table>
body>
html>
<html>
<head>
<title>tab7.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
table cellpadding表格的属性内边距
默认是没有边距的
p>
<h4>没有单元格边距:h4>
<table border="1">
<tr>
<td>Firsttd>
<td>Rowtd>
tr>
<tr>
<td>Secondtd>
<td>Rowtd>
tr>
table>
<h4>有单元格边距:h4>
<table border="1" cellpadding="10">
<tr>
<td>Firsttd>
<td>Rowtd>
tr>
<tr>
<td>Secondtd>
<td>Rowtd>
tr>
table>
body>
html>
<html>
<head>
<title>tab7.htmltitle>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
head>
<body>
<p>
table cellspacing外边距
p>
<h4>没有单元格间距:h4>
<table border="1">
<tr>
<td>Firsttd>
<td>Rowtd>
tr>
<tr>
<td>Secondtd>
<td>Rowtd>
tr>
table>
<h4>单元格间距="0":h4>
<table border="1" cellspacing="0">
<tr>
<td>Firsttd>
<td>Rowtd>
tr>
<tr>
<td>Secondtd>
<td>Rowtd>
tr>
table>
<h4>单元格间距="10":h4>
<table border="1" cellspacing="10">
<tr>
<td>Firsttd>
<td>Rowtd>
tr>
<tr>
<td>Secondtd>
<td>Rowtd>
tr>
table>
body>
html>