需要注意的是/如果页面中设置了多个autofocus属性,那么用户的光标只会定位到最后一个设置了autofocus属性的表单域上。
使用占位文本
Home > Web Front-end > H5 Tutorial > body text

Automatic focus and placeholder text sample code of HTML5 registration form_html5 tutorial skills

WBOY
Release: 2016-05-16 15:49:10
Original
1258 people have browsed it

First look at the sample code below to use HTML auto-focus and placeholder text

Copy the code
The code is as follows:

2:

Register account





New user registration























< /html>

Use autofocus
To use the autofocus function of HTML5, you only need to add the autofocus attribute to the form field
For example, above, think Let the cursor be automatically positioned on the first form field mailbox of the form when the page is loaded and improve input efficiency.

Copy code
The code is as follows:


  • < label for="name">email




  • It should be noted that if multiple autofocus attributes are set on the page, the user's cursor will only be positioned on the last form field with the autofocus attribute set.
    Use placeholder text
    The biggest use of placeholder text is to explain to users how to fill in the form correctly. That is, the input prompt is performed. To use placeholder text, you only need to add the placeholder attribute to the input field
    The following is the input form field using the placeholder attribute

    Copy Code
    The code is as follows:



















    작동 효과는 다음과 같습니다.

    자동 완성 활성화 여부
    autocomplete 속성은 HTML5에서 도입되었습니다. 현재 양식 필드에 대한 데이터를 자동으로 채울지 여부를 브라우저에 알리는 데 사용됩니다. 일부 브라우저는 사용자가 이전에 입력한 데이터를 기억하며 경우에 따라 특히 비밀번호와 같은 데이터를 사용자가 기록하는 것을 원하지 않을 수도 있습니다.
    자동 완성 끄기

    코드 복사
    코드는 다음과 같습니다.



    자동 완성을 방지하려면 atuocomplete 값을 off로 설정하기만 하면 됩니다.
    Related labels:
    source:php.cn
    Statement of this Website
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Popular Tutorials
    More>
    Latest Downloads
    More>
    Web Effects
    Website Source Code
    Website Materials
    Front End Template