当前位置:Gxlcms > html代码 > HTML5第二天笔记

HTML5第二天笔记

时间:2021-07-01 10:21:17 帮助过:9人阅读

1,表格 table

<table></table>

a).表格的完整结构

<table>

<thead>--只能有一个thead

<tr>--行

<th>重要的单元格用th</th>--列

<th>重要的单元格用th</th>

</tr>

<tr>--行

<td>普通的单元格用td</td>--列

<td>普通的单元格用td</td>

</tr>

</thead>

<tbody>--允许多个tbody

<tr>--行

<td>普通的单元格用td</td>--列

<td>普通的单元格用td</td>

</tr>

</tbody>

<tfoot>--只能有一个tfoot

<tr>--行

<td>普通的单元格用td</td>--列

<td>普通的单元格用td</td>

</tr>

</tfoot>

</table>

b).表格的简单结构

<table border="1" cellspacing="0" cellpadding="0" width="500 align="center" bgcolor="red" background="../images/1.jpg">border--边框 cellspacing--单元格间的间距 cellpadding--内容到边框的距离

<tr>

<th></th>

<th></th>

</tr>

<tr>

<td></td>

<td></td>

</tr>

</table>

table属性:border--边框

cellspacing--单元格间的间距
cellpadding--内容到边框的距离

tr属性:height--高度

align--水平对齐 (left/center/right)

valign--垂直对齐(top/middle/bottom)

bgcolor background

td属性:height--高度

align--水平对齐 (left/center/right)

valign--垂直对齐(top/middle/bottom)

bgcolor background

width--宽度

c).合并单元格(td)

水平合并:colspan="2"

垂直合并: rowspan="2"

表格的嵌套,放在td里面

高级应用:表格布局,嵌套

2.表单

作用是负责采集数据

标签

<form action="" method="" name="form1" target="_self/_blank">

用户名:<input type="text" name="username"/>

密码:<input type="password" name="pwd"/>

<input type="submit" value="send">

</form>

--action某个程序来处理表单的信息(例如java PHP .NET)

将客户端输入的信息通过某个程序进行处理(后台)

处理程序的地址

--method 提交方法 两种方式:get;不安全,数据量有限制,通过地址传递数据

post;安全,数据量无限制,

--name 很重要

--submit提交按钮

--value值 表单的任何信息都是值

cheked 默认选项

--hidden是不需要在页面中显示。

隐藏域<input type="hidden" name="code">

按钮:submit,button,reset,image,

表格和表单嵌套的话先写表单标签。

<input type="#" name="" value=""/>

input type类型

text(文本框), password(密码框), radio(单选框) ,checkbox(多选框),,file(文件域),hidden(隐藏域)button(普通按钮),reset(重置按钮),submit(提交按钮),image(图像域按钮)

下拉框:<select name="" size="要显示几项" multple(多选)>

<option value=""></option>

</select>

文本域:<textarea cols="30" rows="5" readonly></textarea>

cols行 rows列 readonly只读

3,HTML4标签的表现形式的分类

块级元素(大标签)block

div table ul ol li dl dt dd h1-h6 p

特点:1,不同行显示 2,可以嵌套块级和行内元素 3,可以设置宽和高

行内元素(小标签)inline

span strong b i em a

特点:1.在同一行显示 2,不能嵌套块级元素 3,不能设置宽和高

行内块级元素 inline-block

img input select textarea

特点:1.在同一行显示 2,可以设置宽和高

不可以交叉嵌套

以上就是HTML5第二天笔记的内容,更多相关内容请关注PHP中文网(www.gxlcms.com)!

人气教程排行