标签:background 背景图片 border bottom middle
6.表格标记
1、知识点
table: 表格
属性:border:边框
width:宽度
height:高度
align:表格的对齐方式
cellpadding:单元格内容到边的距离
cellspacing:单元格和单元格之间的距离
bgcolor:背景颜色
background:背景图片
bordercolorlight:表格的上,左边框,以及单元格的右,下边框的颜色
bordercolordark: 表格的右,下边框,以及单元格上,左的边框的颜色
dir:单元格内容的排列方式 取值:ltr 从左到右, rtl:从右到左
tr: 行
属性:dir:
bgcolor:
td: 单元格
属性: align: 内容的横向对齐方式
valign: 内容的纵向对齐方式 top,middle,bottom
width: 绝对值或者相对值(%)
height:单元格的高度
单元格的合并:
单元格的属性:
colspan: 横向合并
rowspan: 纵向合并
th: 相当于<td> + <b>
属性同<td>
caption: 表格的标题
属性:align: 取值:left,center,right,top,bottom
thead
tbody
tfoot
写与不写的区别:
1. 当表格非常大的时候,如果不写,则必须等表格的内容全部下载完成才能显示。但是用tbody标签的话,那么边下载边显示。 2.如果不写thead,tbody,tfoot那么浏览器解析表格内容的时候是从上到下解析。如果写了,那么顺序任意,浏览器解析的时候还是按照thead,tbody,tfoot的顺序显示内容
2、需求
固定标签的位置,定位,显示在任意位置
一个表格由行组成
合并单元格
3、实现
<body> <table border = "1" width = "800" height = "100" align = "center" cellpadding = "" cellspacing = "1" bordercolordark = "red" bordercolorlight = "green" bgcolor = "" background = "" dir = "ltr"> <caption align = "top">学员信息</caption> <tbody> <thead> <tr bgcolor = "#00cc00" > <th>产品</th> <th>行为</th> <th> </th> <th>无忧币</th> <th>每天上限</th> </tr> </thead> <tbody> <td bgcolor = "red" align = "center" rowspan="4">家园</td> <td align = "center" colspan="2" >注册</td> <td align = "center">10</td> <td valign = "bottom" align = "center">10</td> </tr> <tr> <td rowspan = "2">成龙章子怡</td> <td>58</td> <td>男</td> <td>香港</td> </tr> <td bgcolor = "red" align = "center">家园</td> <td align = "center" colspan="2" >注册</td> <td align = "center">10</td> <td valign = "bottom" align = "center">10</td> </tbody> </table> </body> </html>
本文出自 “与君共勉” 博客,请务必保留此出处http://rickyigoogle.blog.51cto.com/8747999/1682782
标签:background 背景图片 border bottom middle
原文地址:http://rickyigoogle.blog.51cto.com/8747999/1682782