五、表单元素和元素类型

一.表单元素

• input的其他布尔属性:maxlength/disabled/checked/name/value

  • disabled:禁用,禁止用户交互

    checked:默认选中, 只能用在radio和checkbox

  • 表单元素需要有name才会提交,没有就不会提交

input和button的type都可以设置 `button`,`reset`,`submit`
值得注意的是button的type默认是`submit`

• input和lable结合使用

  

• 去除input的outline

  • outline:none去除边框

• tabindex---控制聚焦 - 引用 : www.cnblogs.com/programmerz…

• textarea-简介

  • textarea的属性

    • cols->列数

    • rows->行数

    • resize:

      • resize:none禁止缩放:
      • resize:horizontal(水平方向可以缩放)
      • resize:vertical(垂直水平可以缩放)
      • resize:both(默认值)

• select和option---下拉多选

-   selected默认在select里面被选中
-   multipe:多选
-   size:最多显示多少个

• form

  • action

    • 用于提交表单数据的url

  • method(前端向服务器发送请求)

    • get

    • post

      • get	post
        1.在请求URL后面?发送服务器参数,多个参数之间用&隔开	数据放在请求体,开发者工具查看->network
        2.get请求会限制数据大小()1K

  • target

    • 默认是在当前页面
    • 新打开一个页面_blank(不常用)

  • enctype----在向服务器发送表单数据之前该如何对数据进行编码

    • file

  

  • accept-charset
    • 用于表单提交的字符编码。 默认值是保留字符串“UNKNOWN”

二. 元素类型

• 显示类型

  • 按照元素显示能不能在同一行划分

    • 块级元素

      • 独占父元素的一行

    • 行内级元素

      • 多个行内级元素可以在父元素的同一行显示

• 按照内容类型划分

  • 替换元素
  • 非替换元素

• display的属性-----常考

  • block变成块级元素,浏览器默认给块级元素设置

  • inline变成行内元素

  • none隐藏元素后元素不占据空间

  • inline-block

    • 让元素同时具有行内级元素和块级元素的特点

    • 可以和其他元素同一行显示

    • 可以设置宽和高