asp.net布局（一）表格布局

最新推荐文章于 2020-11-27 20:56:15 发布

原创最新推荐文章于 2020-11-27 20:56:15 发布 · 4k 阅读

6 ·

CC 4.0 BY-SA版权

asp.net 专栏收录该内容

13 篇文章

订阅专栏

本文介绍了ASP.NET中使用HTML表格进行布局的方法，包括结构、样式和代码示例，展示了如何通过<table>、<tr>、<td>等元素创建和美化表格，以及在表格中嵌套表格以实现复杂布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

网页的表格布局：

常用<table>表 <tr>表行 <td>表列，来布局
方法：
1、结构
<table> //该表为两行一列
     <tr> //该处放置表的第一行，他有两列
  <td></td>
  <td></td>
     </tr>

     <tr> //该处放置表的第二行，该行有一列，并且在该列又放置了一个表，继续做行列的划分
  <td>
      <table></table>
  </td>
     </tr>
</table>

2、样式
<table 样式></table> //该样式会影响整个表
<td>内容</td> //在列中要加入的内容，如文字，控件，图片等等。
<tr></tr> //一般在行中不允许加内容。

3、代码示例
<table style="text-align:center" border="0" cellpadding="2" cellspacing="0" class="border0" width="100%">
    <tr>
<td class="title1" style="width: 10%">姓名：</td>
        <td class="text0" style="width: 25%">
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
     <td style="width:8"> </td>
     <td><input id="txtProjectName" name="txtProjectName" style="WIDTH: 100%" runat="server" /></td>
     <td style="width:8"> </td>
  </tr>
     </table>

    </td>

<td class="title1" style="width: 10%">年龄：</td>
        <td class="text0" style="width: 25%">
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
                <tr>
     <td style="width:8; height: 24px;"> </td>
     <td style="height: 24px"><input id="Text1" name="txtProjectName" style="WIDTH: 100%" runat="server" /></td>
     <td style="width:8; height: 24px;"> </td>
         </tr>
     </table>
</td>

<td class="title1" style="width: 10%">单位：</td>
        <td class="text0" style="width: 25%">
            <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
            <td style="width:8"> </td>
     <td><input id="Text2" name="txtProjectName" style="WIDTH: 100%" runat="server" /></td>
     <td style="width:8"> </td>
  </tr>
     </table>
</td>



    </tr>

    <tr>
       <td class="title1" style="width: 10%">备注：</td>
       <td class="text0" style="width: 25%">
           <table width="100%" border="0" cellspacing="0" cellpadding="0">
         <tr>
     <td style="width:8"> </td>
     <td><input id="Text3" name="txtProjectName" style="WIDTH: 100%" runat="server" /></td>
     <td style="width:8"> </td>
         </tr>
    </table>
       </td>


    </tr>

</table>

4、效果图