第二十节-重要表单（form 与 input)

Posted 2020-11-24 yzdwd

网页中 搜索框 或者注册单都是用表单元素来做的

form: 三个属性  1.action: 提交地址（目前写#练手)     2.method:提交方法：get/post， get提交会将键值对显示在网址不安全，post则不会     3.target: 可写_blank,在新网页打开。4.name 如果写这个属性，那么值就不可空，且要独一无二，还要与表内容契合

form 的子元素：input（行内元素，但具有行内块属性)

input：三个属性  1.type（类型)    2. name   3.value       (name 与 value组成键值对 传递给 后端,后端会告诉前端对name value有什么规范的，name是键名，value是键值）

                           4.placeholder(占位)

        type种类：1.text <input type="text" name="文字“ value="我是内容">

                         2.radio(单选框)    <input type="radio" name="女人” value="1" id="1"><label for="1"> 女人</label>

                         3checkbox(多选框)  <input type="checked" name="女人” value="1" id="1"><label for="1"> 女人</label>

                                     label配合单选框 多选框使用，把文字放在label,点击文字或者按钮都可以，以此提升用户体验

                                    disabled :禁用   checked: 默选

                                                        <input type="radio" name="女人” value="1" id="1" checked ><label for="1"> 女人</label>

                        4.reset(重置按钮，点击清空form内容)

                                                        <input type="reset" value="重置表单">

                        5.submit(提交按钮)  <input type="submit" value="提交">

                        6.password(密码)    密码：<input type="psaaword" name="password">

                        7.button(按钮）      <input type="button“ value="普通按钮">

                              与button区别：button自带提交效果           <button>你</button>

                        8.现在用不到：image与file    <input type="image" src="">(一般给input背景图片带代替type="image")

                                                                    <input type="file">

                        9.hidden标签， <input type="hidden" name="" value="">   用户看不到的标签。