• 学习HTML5一周的收获3


    [form]
    1、两个属性
    action:表单提交的服务器地址
    method:数据使用的方法.get/post
    >>>get和post的区别
    get传参数使用URL传递,所有参数可见,不安全;get传参数量数据有限;
    post传参数使用http请求传递,较安全,post可传大量数据
    但是前者传递的速率大于后者
     
    >>>URL传参数的形式,链接URL地址?name1=value1&name2=value2
     
    2、input的常用属性
    type:设置input的输入类型
    name:给input输入框起名,一般情况下,name属性必不可少,因为,传递
    数据时,使用name=value(输入内容)的形式传递
    value:input输入框的默认值
    placeholder:输入框的提示内容,当input有默认的value或者输入值时,
    placeholder消失
     
    3、input-type属性的常用属性值
    text:文本输入框
    password;密码输入框,输入内容默认显示小黑点
    radio:单选框
    使用时,value属性必填,提交时,提交为value中的默认值
    radio/checkBox凭借name属性,确定是否同一组,name 相同为同组,只能选一个
    使用checked="checked"属性,设置默认中选项
    file:文件上传
    使用accept="类型",设置只能上传的文件类型,image/*任意格式图片
    submit:提交按钮,将所有表单内容提交给后台服务器
    reset:重置表单数据,将表单数据恢复到默认状态
    image:图形提交按钮。跟submit一样,具有表单提交功能。
    使用src属性,选择图片路径
    button:普通按钮,没用
     
    4、属性名等于属性值的情况
    checked="checked" 设置radio或checkBox的默认选中项
    multiple="multiple" 设置select控件为多选
    selected="selected":设置select控件,默认选中的option选项
    readonly="readonly" 设置为只读模式,不允许编辑。
     
    5、【下拉选择控件 select】
    ① 写法:<select>
    <option></option> //可以有N多个
    </select>
    ② name属性,应该写在<select>上,所有选项只有一个name
    ③ multiple="multiple" 设置select控件为多选,可在界面使用Ctrl+鼠标,进行多选。一般不用。
    ④ option常用属性:
    value="":当option没有value属性时,往后台传递的是<option></option>标签中的文字;
    当option有value属性时,往后台传递的是value属性的值。
    title="":鼠标指上后显示的文字。
    selected="selected":默认选中。
    ⑤ <optgroup label="山东省"></optgroup> :用于将option标签进行分组,label属性表示分组名。
     
    6、 【文本域 textarea】
    ① 写法:<textarea></textarea>
    ② 设置宽高style=" 200px; height: 150px;" 自身有cols="" rows=""两个属性,但不常用
    ③ readonly="readonly" 设置为只读模式,不允许编辑。
    ④ style="resize: none;" 设置为宽高不允许修改。
    ⑤ style="overflow: ;" 设置当文字超出区域时,如何处理。
    >>> 也可以通过overflow-x/overflow-y分别设置水平垂直方向的显示方式。
    >>> 常用属性值:hidden 超出区域的文字,隐藏无法显示
    scroll 无论文字多少,均会显示滚动
    auto 自动,根据文字多少自动决定是否显示滚动条(默认样式)
    7、表格的边框与标题
    <fieldset>表格的边框
    <legend>联系方式</legend>表格的标题
    。。。N多个表单元素(input/select/textarea)
    </fieldset>
    HTML5智能表单
    H5新增input的form属性,用于指向特定form菜单的ID,实现input无需放在form标签中
    ,即可将表单进行提交
    <form id="form1">
    ...
    <input form="form1">
    ③ 新增input的属性:
    Autocomplete:自动完成功能 根据之前输入过的内容在下次输入时根据以前的内容提示自动完成,
    有两个属性值
    许多浏览器自动开启
    有两个属性值 off on
    可以在<form>标签上设置Autocomplete,控制整张表单的自动完成开关,但是可以在个别input上单独设置,覆盖form的整体设置
    Autofocus:自动获得焦点 autofocus="autofocus"
    Form:所属表单
    Required:必填 required="required"设置input必填
    Pattern:验证input的模式
    Placeholder:提示
  • 相关阅读:
    php configure –help说明
    HTML5(目前)无法帮你实现的五件事多媒体
    Centos搭建PHP5.3.8+Nginx1.0.9+Mysql5.5.17
    lighttpdmod_secdownload 防盗链
    中文环境下PostgreSQL的使用
    一步一步教你安装Nginx+PHP+Mysql
    20+ 个免费和高级的 Web 视频播放器
    二十个你必须知道的SEO概念
    IO流
    sofaBoot
  • 原文地址:https://www.cnblogs.com/zhang11424/p/6539256.html
Copyright © 2020-2023  润新知