网站建设
移动互联网
品牌设计
创新应用
新闻动态
网站百科
简体

网页的表格布局

时间:2014-07-25 来源:尚品中国 类型:网站百科
字号:   

网页是信息的载体,为了方便、快捷地将大量的数据和信息组织在一起,常常要使用表格,表格标记对于网页制作是很重要的。现在很多网页都是使用多重表格来进行网页布局,因为表格不但可以固定文本或图像的输出,而且还可以任意地进行背景色和前景色的设置。

下面说下基本表格的显示形式:
 <TABLE>...</TABLE>标记对用于创建表格。一个表格的基本元素由以下4个部分组成:
   ·<TABLE>...</TABLE>定义表格区。
   ·<TR>... </TR>定义表格行。
   ·<TH>...</TH>定义标题行单元格,或<TD>...</TD>定义数据单元格。
   ·<CAPTION>...</CAPTION>定义表格标题。
若要创建一个基本的表格,可以使用以下HTML代码。
<TABLE>
<CAPTION>表格标题文字<CAPTION>
<TR>
      <TH>标题</TH><TH>标题</TH>...<TH>标题</TH>
<TR>
<TR>
      <TD>数据</TD><TD>数据</TD...<TD>数据</TD>
<TR>
...
      </TABLE>
一般<TH>...<TH>与<CAPTION>...</CAPTION>标记是可选的,但其他3对标记是必选的。
 
<CAPTION>标记放在<TABLE>...</TABLE>标记对之间,表格的行标记之前,它可以使用align属性,确定表格的标题放在表格上方还是下方。
    ·align=top;标题放在表格的上方,居中(默认值)。
    ·align-bottom:标题放在表格的下方,居中。
注意:表格间允许相互嵌套,但不能交叉嵌套。
 
【例1-1】设计一个3行4列的基本表格(1-1.htm ),包含表格标题(<CAPTION>)和表格标题行(<TH>),表格效果如图1-1所示
表格的页面布局
<HTML>
<HEAD><TITLE>基本表格</TITLE></NEAD>
<BODY>
<TABLE width="80%" height="82" border="1" align="center">
<CAPTION>学生信息表</CAPTION>
<TR><TH>姓名</TH><TH>性别</TH><TH》年龄</TH><TH>备注</TH></TR>
<TR><TD>王林《/TD><TD>男</TD><TD>20</TD><TD>优秀团员</TD></TR>
<TR><TD>赵云</TD><TD>女</TD><TD>24</TD><TD>三好学生</TD></TR>
</TABLE>
</BODY>
</HTML>


您好,现在就与尚品客服交流

专业网站建设 | 大型网站开发 | 营销网站建设 | APP开发等业务

您可以直接电话快速沟通

北京专线:010-60259772(总部)

天津专线:022-58793660

假日热线:010-60255689

北京地区微信

天津地区微信

快速在线提交需求

请输入您的姓名(尚品将对您的联系方式严格保密)

请输入您的联系电话或微信号