表格布局：表格的嵌套
---------------------------
表单：
作用：从访问web站点的用户那里获得信息。
客户端与服务器端进行信息交流的途径。
表单标记：
1.创建表单：所有的表单元素只有在表单里面才会起作用。
2.表单的属性：
action=url(传送目标)
method：get:明文提交，对提交的文件的大小有限制，一般用于比较小的内容
post:加密提交，对提交文件的大小没有限制。
name:设置表单的名称。
表单的元素标记：
type:
text:普通文本框类型
password：定义密码输入
radio：单选按钮，name的名字必须相同，才会互相排斥，默认选中checked="checked"
file：上传文件，只要form表单中需要上传文件，就必须设置form的一个属性，enctype="multipart/form-data"
checkbox:复选框，可以提交多个，名字相同，默认选中，checked="checked"
按钮：
type：
"submit":提交表单
button:普通的按钮
reset:重置按钮
image:自动提交
src:图片路径
name:名字
value="显示值"
disabled:不可点
隐藏域:
type="hidden"
不用input的标签
select:下拉列表
name="后台读取"
选项：
<option value="传给后的的真正值">列表显示值</option>
默认选中：
在option中加select属性
multiple属性：
设置多选，和size属性搭配使用，size为显示的条数
<optgroup lable="分组名称"></optgroup>
textarea:多行文本框
name:名字
cols：每行显示的字数
rows:显示的行数
lable标签：
标注内容
for="要标注标签的id"
<input type="radio" name="sex" value="女" id="woman"/>
<label for="woman">女</label>
提交按钮：
<button></button>
<fieldset>
<legend title="测试">注册信息</legend>
包含的内容
</fieldset> ----------------------------
html5的新特性
---------------------------
属于input标签：
type=
date：用于日期选择的表单域，支持日期，月份。
search：用于显示一个输入搜索关键字的表单。
range：显示为滑块。
number：用于包含数字值的输入字段。您可以设置可接受数字的限制。
color：用于输入颜色的表单。
例：哔哩哔哩登录页面
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>哔哩哔哩弹幕网注册</title> <link rel="icon" href="../img/logo.jpg" /> </head> <body> <!--导航栏--> <table style="width:1350px;" border="0" cellspacing="0"> <tr> <td> <ul style="list-style-type: none;"> <li style="float: left;font-size: 8px;padding-left: 300px;"><img src="../img/logo2.png" height="25px" width="25px" /></li> <li style="font-size:15px;float: left;padding-left: 50px;">主站</li> <li style="font-size:15px;float: left;padding-left: 50px;">画友</li> <li style="font-size:15px;float: left;padding-left: 50px;">游戏中心</li> <li style="font-size:15px;float: left;padding-left: 50px;">直播</li> <li style="font-size:15px;float: left;padding-left: 50px;">会员购</li> <li style="font-size:15px;float: left;padding-left: 50px;">周边</li> </ul> </td> </tr> <!--横幅--> <tr bgcolor="#00A0D8"> <td> <img src="../img/rl_top.35edfde.png" height="100%" /> </td> </tr> </table> <br /> <hr color="lightgray" width="80%" size="1" /> <!--滚动字幕--> <marquee οnmοuseοut="this.start()" οnmοusemοve="this.stop()" align="middle"> <font color="grey">bilibili弹幕大家庭欢迎你</font> </marquee> <marquee οnmοuseοut="this.start()" οnmοusemοve="this.stop()" scrollamount="10"> <font color="grey">二次元少年少女聚集区</font> </marquee> <!--登录--> <div align="center"> <form> <table width="600px" border="0" cellpadding="20px"> <caption> <font size="6" style="font-family: '微软雅黑';color: #666666;">登录</font> </caption> <tr> <td colspan="2"></td> </tr> <tr> <td colspan="2"><input type="text" name="username" size="30" placeholder="你的手机号/邮箱" /> </td> </tr> <tr> <td colspan="2"><input type="password" name="userpsw" size="30" placeholder="输入你的密码" /> </td> </tr> <tr> <td colspan="2"><input type="checkbox" /> <font color="darkgrey" size="2">记住我 如果不是你的电脑，请不要勾选此项</font> </td> </tr> <tr> <td> <a href="#"><img src="../img/login.jpg" /></a> </td> <td> <a href="text3.html"><img src="../img/zc.jpg" /></a> </td> </tr> </table> </form> </div> </body> </html>
2834
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
