<a></a>超链接标签1.用于定义一个可以点击跳转的连接2 herf：超链接跳转的路径（必有属性） 1)内网本机路径，相对路径和绝对路径2）互联网路径，带http://...的地址3）本页：不写默认跳转本页，相当于#3 注意：1）a标签内容体，不仅仅是文字，也可以是其他内容，例如图片2）a标签的href属性，不仅仅可以链接到html上，也可以链接到其他文件上，列表1无序列表 ul li 2.有序列表 ol li 3.定义列表dl dt 被定义的内容 dd对定义内容的描述dl ul、ol、之间都可以互相嵌套表格<table></table>表格标签 ，用于在效果中定义一个表格border：设置表格的边框粗细width：设置表格的宽度<tr></tr>表格中的行标签，用于定义一个变革行<td></td>表格的单元格标签，用于定义一个表格中的单元格<th></th>表格的表头单元标签，用于在小锅中定义一个表格行中的表头单元格<th>和<td>唯一区别：<th>内容居中加粗行、列、单元格、表头、数据表格是为了更好的格式化显示数据单元格合并<td>或者<th>都有两个单元格合并属性：colspan：跨列合并单元格rowspan：跨列合并单元格合并步骤：1、确定合并那几个单元格，确定是跨行还是跨列合并2、在第一个出现的单元格上书写合并单元格属性3、合并几个单元格，属性值就写几4、被合并的单元格必须删掉三、内联与块标签<span></span>内联标签，一行上定义多个元素，进行内容显示有多少内容，就会占用多大空间span不会自动换行<div></div>块标签，一行上定义一个一个块，默认沾满一行，进行内容显示适用于大量数据展示。或者用来布局表单现实生活中的表单是用来提交信息的，比如：办理银行卡填写的申请表、找工作写的简历、入学时填写的网页中的表单是用来想服务器提交信息的，我们最常用的扁担就是百度的搜索框表单标签<from></from>用于在效果中定义一个表单作用：用于体检用户填写额数据，提交给服务器的程序文本框供用户输入，类似java的Scanneraction ： 将数据提交到何处默认提交到本页本机内网路径 相对路径：常用 绝对路径：不建议使用 互联网路径：https://www.12306.com/xxxmethod : 将数据以何种方式提交默认为get提交范式可定义为： get或者 postGet方式提交特点：把数据拼接到地址栏上Post方式提交特点：没有吧数据拼接到地址栏上，而是在请求体中Get 和Post提交但是区别1、Get提交的参数列表拼接到地址栏后面，post不会拼接到地址栏2、get范式提交的数据，敏感信息不全全，post但是提交的数据相对安全3、get方式提交的数据是有限的，post方式从理论上提交的数据是无限大的尽量使用post方式提交表单输入项标签<input/>标签表单输入项标签之一，用户可以在该标签上，通过填写和选择，进行数据输入type ： 设置该标签的种类text：文本框，默认password：密码框，内容非明文radio：单选框，在同一组内又单选的效果chechbox：复选框，在同一组内有复选鲜果submit：提交按钮，用于控制表单提交数据reset：重复按钮，用于控制表单提交数据file：附件框，用于文件上传hidder：隐藏域，一般用作提交服务器需要拿到，单用户不需要看到的数据button：普通按钮，需要和js事件一起用name：单选框，复选框进行数据的分组，设置该标签对应的参数名，要提交数据给后台，西辟邪namevalue ：设置该标签对应的参数值/作为按钮的名字checked：设置单选框/复选框的默认选中状态readonly：设置该标签的参数值只读，用户无法手动更改，数据是可以正常提交的disabled：设置该标签不可用，参数值无法更改，并且无法提交表单点击提交按钮，提交数据时url?参数列表参数列表格式 ： 参数1=参数值 & 参数2=参数值 & 参数3=参数值......？gender=on (on表示选中)？gender=male&age=18.....单选框，用户只能选择，不能输入，苏姚指定value属性文本框，用户可以自由输入，不一定指定value值，指定表示默认值，placeholder 表示提示文字选择框标签<select></select> 标签，定义一个下拉选择框name：设置该标签对应的参数名multipe：设置选项全部显示。并且可以进行多选提交，不写此属性默认为单选<option></optiom>标签，选项标签，为一个选择框添加一个选项value：设置需要提交的参数值selected：设置选项的默认选中状态注意事项：option的内容体一般是用来展示的参数值应该是option的value属性值文本域标签<textarea></textarea>标签文本域，多行文本框name：设置标签对应的参数名文本域和文本框的区别1、文本框不能换行，文本域可以2、文本框参数值是value属性，文本域参数是标签的内容体提交表单之一事项提交中文问题 为什么使用UPL编码 正常提交 ： ?password=123&username=zhangsan 非正常 ： ?password=123#asd&pwe&username=zhangsanUPL编码解决方式：特殊符号，中文进行编码
代码
<!DOCTYPE html>
<html>
<head>
<title>内联与块标签</title>
</head>
<body>
<form action="target.html">
用户ID<input type="hidden" name="uid" value="123"><br>
照片<input type="file" name="photo"><br><br>
用户名<input type="text" name="username" value="李霜" placeholder="提示文字"><br><br>
密码<input type="password" name="password" value="123123" disabled="disabled" placeholder="提示文字"><br><br>
<!-- value 默认值 placeholder 提示文字 readonly、disabled不能修改-->
手机<input type="text" name="phone" value="" placeholder="手机号"><br><br>
邮箱<input type="text" name="Emily" value="" placeholder="邮箱"><br><br>
性别<input type="radio" name="gender" value="male">男
<input type="radio" name="gender" value="female" >女<br><br>
年龄<select name="star">
<option value="1">18岁以下</option>
<option value="2">18~25</option>
<option value="3" >25~35</option>
<option value="4">35以上</option>
</select><br><br>
爱好<input type="checkbox" name="hobby" value="meinv">美女
<input type="checkbox" name="hobby" value="movie">游戏
<input type="checkbox" name="hobby" value="movie">旅游
<input type="checkbox" name="hobby" value="movie">看书
<input type="checkbox" name="hobby" value="eat">电影<br><br>
户口所在地<select name="star" >
<option value="a">东北地区</option>
<option value="b">华北地区</option>
<option value="c" >华东地区</option>
<option value="d">中南地区</option>
<option value="d">西南地区</option>
<option value="d">西北地区</option>
<option value="d">港澳台特别行政区</option>
</select><br><br>
你喜欢的明星
<select name="star" >
<option value="zy">赵月宁</option>
<option value="gxw">林青霞</option>
<option value="qbl">张曼玉</option>
<option value="zyn">刘亦菲</option>
</select><br><br>
自我介绍<textarea name="info"></textarea><br><br><!-- 多行文本域-->
<input type="submit" value="注册">
<input type="reset" value="重置">
<!-- 或者 <input type="reset" name="">-->
<input type="button" value="按钮"><br><br>
<button type="submit">提交</button>
<button type="reset">重置</button>
<button type="button">按钮</button>
</form>
</body>
</html>
模拟后台数据库
<!DOCTYPE html>
<html>
<head>
<title>模拟后台服务器</title>
</head>
<body>
<h1>提交成功</h1>
</body>
</html>
