In-order to display a form control with focus when a page loads you will need to use the autofocus attribute for HTML5. The autofocus attribute can be specified in the <input> element (but not when the type attribute is set to hidden), the autofocus attribute can also be specified in the <select>, <textarea>, and <button> elements. The autofocus attribute provides a way to put focus on a form control when the page is loaded, which allows the user to just start typing without having to manually put focus on the main form control.
The autofocus attribute is a boolean attribute, which means that the autofocus attribute needs no value all you have to do is include the word autofocus in the desired
element for HTML5, but in XHTML you need to include a value for all the
attributes even for the boolean attributes, for example the autofocus attribute will need to have a value of autofocus, for instance autofocus="autofocus" in-order for the attribute to validate in XHTML.
You can only have one element with an autofocus attribute per web page document.
Here is how to code the autofocus attribute HTML5 style.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Welcome To HTML5</title>
</head>
<body>
<form>
<input type="search" autofocus>
</form>
</body>
</html>
Here is how to code the autofocus attribute for XHTML5.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta charset="UTF-8" />
<title>Welcome To XHTML5</title>
</head>
<body>
<form>
<input type="search" autofocus="autofocus" />
</form>
</body>
</html>
0 comments:
Post a Comment