前端 概述02

Day2

表格标签补充，字体标签font

<table>
    <caption>
    	<font size="10">xxx系统</font>
    </caption>
</table>

补充强调，1）<a 标签的target属性，既指定资源文件打开方式

​ _blank 新建窗口打开 _self 当前窗口打开（默认）

​ 2）在和框架标签使用的时候，应该要指定在某个框架标签中打开，需要指定的是frame的name属性的值，就是框架所包含的html页面的名称

表单框架（很重要）

表单标签：form 属性：action=“提交的后台地址” method=“提交方式”（常用get/post）“

表单标签场景：

​ 注册、登录、修改用户信息都是用表单，表单（中内容都是字符串）中的每个表单项都必须加入name属性；给后台标记，前台用户输入需要后台查阅数据库来校验

​ 前台进行正则表达式校验–action

面试题（get和post的区别）

get:（地址栏携带参数）将用户数据提交到地址栏，即url统一资源定位器处。因为个人隐私甚至密码都明文展示所以会导致用户数据不安全，需要后台加密技术（md5加密–shiro,安全卫士，进行用户的身份认证和授权，加盐，比如初始123，加入特殊字符”qianfeng“,重复加密多次）。get提交是提交到地址栏，所以get提交方式数据大小是有限制的。

post：（io流–input stream…的方式提交，数据大小没有限制）不会将用户信息提交到地址栏，相对get方式安全，但是在检查network中还是可以看到。适合私密数据提交，但仍需要后台加密处理。

<input name="username" type="text" placeholder="请输入用户名"/>

h5新增属性：placeholder 当键入时提示文字变灰 即消失

<input type="hidden" name="id" id="1" />

隐藏域（必须记住）没有任何效果，但是可以携带数据到后台

常见的表单项

只要是表单标签中的表单项，必须填写属性name,给后台要标记用户书写的内容

<input type="text" /> 文本输入框
<input type="password" />密码输入框
<input type="radio" />单选按钮
	在性别选项中，应该将信息看成同一组信息，要么是男，要么是女，name属性标记时给定相同的name属性值，否则既男又女（可以同时选）
<input type="checkbox" />复选框
	在爱好复选框中，思路同上性别问题，要求相同的name属性值
<input type="date" />h5提供的日期组件
<input type="mail" />当用户提交时填写内容必须符合邮箱格式@（组件自带校验 是否有@格式在内，否则提交不了，提示错误信息）
		邮箱，一般是文本输入框，type="text",后期可以通过（正则表达式）进行校验
<input type="file"/>文件上传
<input type="button" value="这是一个按钮"/>普通按钮，必须给value属性
<input type="submit"/>特殊的提交按钮，将信息提交到action服务器（指定后台地址）
<input type="reset"/>清空以上选项中的内容
<select name="xx">下拉菜单
	（<option>下列选项）
	<option value="">xxx</option>
	<option value="">xxx</option>
转义字符
	&nbsp 一个空格 &ensp 两个空格
	

框架标签

<frame></frame>只能包含一个html页面
	frameset框架集标签
		特点：不能和body共存，要么在body前面，要么删掉
示例：
<frameset rows="20%,*">
        <frame src="head.html"> </frame>
    <frameset cols="15%,*">
        <frame src="menu.html"></frame>
		<frame src="main.html"></frame>
    </frameset>
</frameset>
rows 从上往下看，垂直结构，划分多少个部分，每一个部分所占整体的权重百分比
cols 从左到右看，水平结构，划分多少个部分，每一个部分所占整体部分的百分比

文本标签–原样输出

 xxx 

补充：<em>xxx</em>--斜体标签 <i></i>斜体，多语境上的强调
<strong>xx</strong>通用strong，加粗标签， <b></b>语境上的强调

补充：表格标签<table 中的cellspacing单元格之间间隔