The more commonly used type attributes and usage in the <input> tag

The <input> tag itself is empty in the HTML code, that is to say, calling the <input> tag alone has no effect, and the commonly used attribute of the <input> tag is type, and the type attribute also has many attributes. This article mainly introduces some common attributes of type attribute.

Commonly used type attributes

Plain text content <input type="text" >
password plain text content <input type="password">
submit button<input type="submit">
single selection box<input type="radio">
multiple selection box<input type ="checkbox">

The more commonly used types are the above type attributes.

The difference between text and password

  text 和 password  实际上是一模一样的,他们全部是代表纯文本内容属性,text 属性并不会对输入框内的文本内容进行隐藏,而 password 属性却会对输入框内的文本内容进行隐藏保护,password 属性一般用于密码输入框。

    submit 属性的作用

The role of the submit attribute is to submit the content in the form it is in to the server

The submit attribute will only appear once in a single form under normal circumstances.

Introduction of radio attributes and code writing

 radio 属性的介绍 

 radio 属性代表的是单选框,我们在注册账号的时候,

 一般的话都有一个选择性别的选项,而这个选项是单选的,

  这钟选择框就是单选框,也就是<input>标签通过type调用 radio 属性所达到的效果

  效果演示:

                   请选择你的性别:
             男 女 保密

  代码的写法:

Markup
<form> 请选择你的性别<br/>
<input type="radio" name="x"">男
<input type="radio" name="x" >女
<input type="radio" name="x">保密
</form>

Introduction to checkbox attributes and code writing

  checkbox 属性的介绍:

  checkbox 属性代表的是多选框,在很多网页里面也是可以看到的,例如选择兴趣爱好,很多人不止一种兴趣爱好,而这个时候就会用到checkbox属性来制作一个多选框,写法和单选框radio属性一样的。

   演示效果 :

        你有哪些兴趣爱好?
        书法 篮球 足球

    代码的写法:

Markup
<form> What are your hobbies? <br />
<input type="checkbox" name="x">Calligraphy
<input type="checkbox" name="x">Basketball
<input type="checkbox" name="x">Football
</form>

postscript

 单选框和多选框的前提是他们的选项是在同一个组,我们可以通过 name 属性来设置一个组。

 我上面所说的属性,全部是表单里面<input>标签所使用的 type属性,并不代表在其他标签里面效果也一样。

     https://www.cuteur.cn/post/513.html

Guess you like

Origin blog.51cto.com/14492332/2578220