html表格

表格的主要用途是显示数据和图片,并且可以布局

 表格元素的名称是table

<tr></tr>行

<td><td>列  

border表格边界  bordercolor边界颜色 width表格宽度    bgcolor表格背景色   align对齐方式 center居中

cellspacing是空隙大小,是两个行、两个列直间的距离

cellpadding是填充大小,各行各列中的内容被填充,这样会在一定程度上撑大格子

******************表格**********************<br>
<!--tr表示一行,td表示一列-->
<table border=5 cellspacing=5 bordercolor=yellow width=300px bgcolor=red>
<tr align="center"><td>1</td><td>2</td><td>3</td></tr>
<tr align="center"><td>4</td><td>5</td><td>6</td></tr>
<tr align="center"><td>7</td><td>8</td><td>9</td></tr>
</table><p></p>

<table border=5 cellpadding=5 bordercolor=yellow width=300px bgcolor=red>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>4</td><td>5</td><td>6</td></tr>
<tr><td>7</td><td>8</td><td>9</td></tr></table>

<table border align="center" width=500px>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>

<tr><td>A</td><td>B</td><td>C</td> </table>

 

<html>
<head><title>菜谱</title></head>

<body>
<table border=5 bordercolor=yellow cellspacing=0  width=400px height=170 align=center border=5>
<tr align=center><td colspan=3 >星期一菜谱</td></tr>

<tr align=center><td rowspan=2>素材</td><td>青草茄子</td><td>花椒扁豆</td></tr>
<tr align=center><td>小葱豆腐</td><td>炒白菜</td></tr>

<tr align=center><td rowspan=2>荤菜</td><td>鱼香肉丝</td><td>红烧排骨</td></tr>
<tr align=center><td>油焖大虾</td><td><img src="paigu.jpg" width=150/></td></tr>

</table>

</body>
</html>

 

 

posted @ 2016-09-07 09:01  缘琪梦  阅读(443)  评论(0编辑  收藏  举报