首页 > 代码库 > 表单元素和表格

表单元素和表格

2024-10-01 21:34:02   217人阅读

今天尝试去自己做表格，试了一下单元格合并，通过尝试我发现如果规定了高度在合并，那么删除后的表格高度为初始高度，如果想要改变只能改变删除之后剩余的单元格高度

<tr>
    <td rowspan="2" >&nbsp;</td>
    <td height="50">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>

 

而在同一个单元格我没有实现行与列的合并

<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
  <th>姓名</th>
    <td bgcolor="#00FFFF" rowspan="3" colspan="2">&nbsp;</td>
   
    <td>&nbsp;</td>
  </tr>
  <tr>

表格代码：

 

<body>
<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <th height="50">11</th>
    <th>22</th>
    <th>33</th>
  </tr>
  <tr>
    <td height="50" align="center" valign="bottom" colspan="2">11</td>
   
    <td align="center" valign="bottom">33</td>
  </tr>
  <tr>
   <td height="50" align="center" valign="bottom" rowspan="2">11</td>
    <td height="50" align="center" valign="bottom">22</td>
    <td align="center" valign="bottom">33</td>
  </tr>
  <tr>
    
    <td height="50" align="center" valign="bottom">22</td>
    <td align="center" valign="bottom">33</td>
  </tr>
  <tr>
    <td height="50" align="center" valign="bottom">11</td>
    <td align="center" valign="bottom">22</td>
    <td align="center" valign="bottom">33</td>
  </tr>
</table>
</body>

 

 

 

 

 

表格标签：

1、<table>属性：1）width宽度：百分比

                           像素

                2）bord边框粗细：0表示无边框

                3）cellspacing单元格边距：一般为0

                4）cellpadding单元格间距：一般为0

                5）bordcolor边框颜色

                6）bgcolor背景颜色

2、<td>:1)width单元格宽度：若未设置在单元格中输入内容后宽度自动调整

        2）heigh高度：

        3）align内容水平对齐方式：left左对齐，right右对齐

        4）valign内容垂直对齐方式：center居中对齐，bottom底部对齐，top顶部对齐，middle中部对齐

        5）colspan在行内合并列

        6）rowspan在列中合并行

3、<tr>行：1）height高度

           2）bgcolor背景颜色

4、<th>表头：用来替换<td>,写在<tbody>内

5、<tbody>所有内容写在里面

表单元素：

<form></form>:1、action：网址，页面文件，需要提交给谁（网页）

              2、method：提交方式：get：有长度限制，易丢失，不安全；post：隐式提交，安全 ，长度没有限制

              3、target：提交页面在什么地方打开：_black:在新的选项卡打开；_self:在自身选项卡打开

一、文本输入类：1）文本框：<input type="text" name="" value=""/>

2)密码框：<input type="password" name="" value=""/>

3）隐藏域：<input type="hidden" name="" value=""/>用于存放重要数据，不显示

4）文本域：<textarea cols="文本占几行" rows"文本占几列" />

二、输入选择类：1）单选框：<input type="radio" name="" value="" />

2）复选框：<input type="checkbox" name="ck[]" value="" />

3）选择文件：<input type="file" name="file"/>

4）下拉：<select><option></option></select>

三、按钮：1）普通按钮：<input type="button" value="http://www.mamicode.com/登陆" />

2）提交：<input type="submit" value="http://www.mamicode.com/注册"/>

3）重置：<input type="reset" value="http://www.mamicode.com/重置"/>

4）图片：<input type="image" src="http://www.mamicode.com/图片地址" />

 

表单元素和表格


联系
我们