本章我们练习html的表格的制作:

1.没有边框的表格:

HTML5.0实例练习(二)

HTML5.0实例练习(二)

2.带有表头的表格

HTML5.0实例练习(二)

HTML5.0实例练习(二)

 3.带有标题的表格

HTML5.0实例练习(二)

HTML5.0实例练习(二)

 4.表头跨两列或者跨两行

HTML5.0实例练习(二)

HTML5.0实例练习(二)

 

 5.表格内含标签

HTML5.0实例练习(二)

HTML5.0实例练习(二)

 

6 .单元格边距:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<h4>没有单元格边距:</h4>
<table border="1">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>   
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>有单元格边距:</h4>
<table border="1"
cellpadding="10">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>   
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

</body>
</html>

7.单元格间距

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<h4>没有单元格间距:</h4>
<table border="1">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>单元格间距="0":</h4>
<table border="1" cellspacing="0">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

<h4>单元格间距="10":</h4>
<table border="1" cellspacing="10">
<tr>
  <td>First</td>
  <td>Row</td>
</tr>
<tr>
  <td>Second</td>
  <td>Row</td>
</tr>
</table>

</body>
</html>

 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-06-21
  • 2022-02-20
  • 2021-11-27
  • 2022-12-23
猜你喜欢
  • 2021-05-05
  • 2021-05-01
  • 2022-01-10
  • 2021-11-15
  • 2022-12-23
  • 2021-12-12
  • 2021-07-16
相关资源
相似解决方案