table表格,form表单

(1)table 表格标签:

　　table设置 border:1;属性,单元格带边框的效果;

　　　　style="border_collapse:collapse;"表格中很细表格边线的制作;

　　tr : 每行;

　　td : 每行单元格的数据;

(2)form表单标签:

　　action : 提交的地址;

　　method : 提交的方式 : get(不安全) , post(相对安全)

<!--如果action为空,那么默认是打开页面的地址
缺点:form只能做提交操作,form表单不能接收数据.
-->

　　input表单控件:

　　　　type : text:明文显示用户输入的数据;

　　　　　　 password 密文显示用户输入的数据;

　　　　　　　radio 单选按钮;

　　　　　　 checkbox : 复选框;

　　　　　　 file : 上传文件所用;

　　　　　　　submit : 功能固定化,负责将表中的表单控件提交给服务端;

　　　　value : 控件的值即要提交给服务器的数据;

　　　　name : 控件的名称 , 服务端用;

　　　　disabled : 该属性只要表现在标签中,表示的是禁用该控件;

　　注意 : 如果有文件需要提交给服务器,method必须为post , enctype必须为multipart/form_data

　　状态码简单介绍:

　　　　200以上 : 表示成功请求的状态码;

　　　　300以上 : 缓存;

　　　　400以上 : 404网页加载失败,前端出错;

　　　　500以上 : 后端逻辑出错,后端业务逻辑出错;

协议主机地址端口号路由地址

http : // locahost : 8080/s/a

表单控件 :

　　input: type: text : 文本输入框;

　　　　　　　password : 密码;

　　　　　　　radio : 单选;

　　　　　　 checkbox : 多选;

　　　　　　　file : 文件上传;

　　　　　　　submit : 提交按钮;

　　　　　　　bottom : 普通按钮;

　　select : option text area : 多行文本输入框;

　　以下是例子:

<label for="user">用户名</label>
    <input type="text" name="username" value="" id="user"><br>
    密码: <input type="password" name="password"><br>
    性别: <input type="radio" name="gender" value="male" checked>男
    <input type="radio" name="gender" value="female" >女<br>
    爱好: <input type="checkbox" name="love" value="eat">吃饭
    <input type="checkbox" name="love" value="sleep">睡觉
    <input type="checkbox" name="love" value="bat" checked>打豆豆
    <!--如果是form表单提交,type一定是submit-->
    <br>
    <input type="submit" value="登录">
    <input type="button" value="登录2">
    <button type="submit" disabled>注册</button>
    <input type="reset" value="重置按钮" id="re"><br>
    <input type="file" value="文件选择框">
    <select multiple="" size="3">
        <option >小学</option>
        <option >初中</option>
        <option >高中</option>
        <option >大学</option>
        <option >研究生</option>
    </select>
    <textarea name="" id="" cols="50" rows="20"></textarea>
</form>
<form>
    <fieldset>
    <legend>账号信息</legend>
    姓名: <input value="呵呵">逗比<br>
    密码: <input type="password" value="pwd" size="50"><br>
    </fieldset>
    <fieldset>
    <legend>其他信息</legend>
    性别: <input type="radio" name="gender" value="male" checked="">男
    <input type="radio" name="gender" value="female">女<br>
    爱好: <input type="checkbox" name="love" value="eat">吃饭
    <input type="checkbox" name="love" value="sleep">睡觉
    <input type="checkbox" name="love" value="bat" checked>打豆豆
    </fieldset>

　　前端跟后端进行交互有两种方式 :

　　1. form标签提交 : 如果是get请求,那么会把表单控件input中的name属性对应的值封装成地址栏的key,value值封装成地址栏的value,打包发送到后端,后端进行相应的处理.

　　2.Ajax技术

css : 层叠样式表

　　三种引入方式 : 1. 行内样式优先级最高

　　　　　　　　　2.内接样式 : 基础css选择器:

　　　　　　　　　　　　　　　　id选择器

　　　　　　　　　　　　　　　　class选择器

　　　　　　　　　　　　　　　　标签选择器 : div

　　　　　　　　　　　　　　　　通配符选择器:*{}

　　　　　　　　　　　　高级选择器 :

　　　　　　　　　　　　　　　　　　后代(儿子,孙子 .....)选择器 : div p

　　　　　　　　　　　　　　　　　　子代(亲儿子)选择器 : div>p

　　　　　　　　　　3. 外接样式

　　　　placehdder 在input里把字变成虚字

　　　　em根据当前文字的大小

猜你喜欢