c77

What is used in code to specify the width of an image in responsive web design?

%

Which type of content should use an <aside>

News feeds

Which form input type supports a required attribute?

file

Given the following CSS code:

.box {

 width: 150px;

 height: 150px;

 background: red;

 margin-top: 20px;

 margin-left: auto;

 margin-right: auto;

 -webkit-transition: background-color 2s ease-out;

 -moz-transition: background-color 2s ease-out;

 -o-transition: background-color 2s ease-out;

 transition: background-color 2s ease-out;

}

.box:hover {

 background-color: green;

 cursor: pointer;

}

Which color does this box turn when a user hovers a mouse pointer over it?

Green with a time duration of two seconds

Which document object model (DOM) method does the Canvas element use?

getContext() 

Which JavaScript event handler is associated with the form object?

onreset

Which tag enables developers to include dynamic code in an HTML document?

<script> 

Which form input type supports a required attribute?

file

A web designer reviews the following CSS3 code:

#brand {

font-weight: bold;

}

Which paragraph element will it select?

<p id="brand">Web Design</p>

Given the following CSS code:

body {

  color : white;

}

Which part of an element is affected by the color property?

Text

A web page has a section that contains an <aside> element. The elementis always 10 pixels from the right

and 50 pixels from the top ofthe browser.

Which type of layout positioning does the <aside> element use?

Fixed 

Given the following code:

<form name="Form" action="/action.php" method="post">

Name: <inputtype="text" name="name">

<inputtype="submit" value="Submit">

</form>

What should a developer add or change to ensure thatthe form is validated when submitted? 

The event handler and function should be added to the form tag.

Which code segment declares a variable and assigns a Boolean value to it?

var enabled = true;

Which element should a developer use for a bulleted list?

<ul>

Given the following markup:

<inputid="password" name="password" type="password" class="password" pattern=".{8,12}" required>

What does the markup do?

It aIt allows a user to enter a password between 8 and 12 characters long.llows a user to enter a password between 8 and 12 characters long.

Which global attribute should a developer use to bind a label element to an input element?

for

Given the following CSS code:

div

{

transition-property: opacity, left,top, height;

transition-duration: 3s, 5s;

}

Which value will be assigned for the transition related to the height property? 

5 seconds

Which style sheet code denes the 18-pixel Arial fontfor all leveltwo headers? 

h2

{

font-family: Arial; font-size: 18px; } 

Which option declares a variable called name and assigns the literal value Student to it? 

var name = "Student"; 

Given the following CSS code:

body {

color : white;

}

Which part of an elementis affected by the color property? 

Background

Which markup positions an image so that the lower part of itis even with the lower part of adjoining text? 

<img src="sample.jpg" vertical-align="baseline">

The background-origin property has a value named padding-box.

Which corner of the padding edge does the padding-box value setthe background relative to?

Upper left

Why is JavaScript considered a scripting language? 

The code must be interpreted.

Which CSS transition should be used on an image to make it ease in when a user’s mouse hovers over that

image?

transition-timing-function 

Which CSS property should a developer use to specify the bottom of a 3D element?

perspective-origin

Given the following HTML:

What color would you like to use?

<select autofocus>

<option value = "red">Red</option>

<option value = "blue">Blue</option>

<option value = "green">Green</option>

<option value = "pink">Pink</option>

</select>

What happens when the page loads?

The select element in the form takes focus.

Which programming language provides dynamic content for a web page across all browsers?

JavaScript

Which background-size property value scales the background image to the greatest height and width that fits within the specified content area?

contain

Which technology is used to access the direct object model (DOM)?

JavaScript

Which element allows a developer to add a caption for a created group of items?

<legend>

Which code segment declares a variable and assigns a Boolean value to it?

var enabled = true;

Which HTML input type allows for mailto: address entry?

url

Which code segment contains a conditional expression?

var discount = (total > 250)?true : false;

Given the following markup:

<script>

function dragOver(event) {

}

function drag(event) {

event.dataTransfer.setData("id", event.target.id);

}

function drop(event) {

var id = event.dataTransfer.getData("id");

event.target.appendChild(document.getElementById(id));

}

</script>

<section id="target" ondragover="dragOver(event)" ondrop="drop(event)"/>

<img id="source" src="image.png" draggable="true" ondragstart="drag(event)"/>

Which statement should a developer add to the dragOver function to allow the image to be dragged and

dropped onto the section element?

event.preventDefault();

Given the following code:

var data = {amount:250; freeShipping:true; message: "Your order has been shipped."};

Which data type does the data variable represent?

Object

Given the following code:

ctx.beginPath();

ctx.lineWidth = 3;

ctx.llStyle = "red";

ctx.arc(75, 75, 50, 0, Math.PI * 2,true);

ctx.ll();

ctx.moveTo(0, 0);

ctx.lineTo(100, 100);

Which Canvas application programming interface (API) method should a developer use to add the line to

the drawn path on a canvas? 

stroke()

Given the following CSS code:

.box {

width: 150px;

height: 150px;

background: red;

margin-top: 20px;

margin-left: auto;

margin-right: auto;

-webkit-transition: background-color 2s ease-out;

-moz-transition: background-color 2s ease-out;

-o-transition: background-color 2s ease-out;

transition: background-color 2s ease-out;

}

.box:hover {

background-color: green;

cursor: pointer;

}

Which color does this box turn when a user hovers a mouse pointer over it?

Green with a time duration of two seconds 

What should a developer use to test sites for cross-browser compatibility?

Emulator

Which code segment creates inputtextthat has its value checked against a regular expression?

<input type="text" name="name" pattern="[a-zA-Z]">

A web designer creates the following animation by using CSS3:

#texteffect{

position: relative;

animation-name: scroll;

animation-duration: 5s;

animation-timing-function: linear;

animation-play-state: running;

}

@keyframes scroll {

from {left: 0px;}

to {left: 200px;}

}

How does the content of the element move when the page loads? 

From left to right one time

What should be added rst when embedding CSS in a single web page as an internal style sheet?

A <style> element to the <head> section

Which background-size property value scales the background image to the greatest height and width that fits within the specified content area?

contain

What does an HTML5 code validator conrm about code?

It complies with a standard. 

Which background-size property value scales the background image to the greatest height and width that

ts within the specified content area?

contain

Which method of the Geolocation application programming interface (API) should a developer use to get

periodic updates of a user’s coordinates? 

watchPosition() 

Given the following HTML code:

<ul>

<li>One</li>

<li>Two</li>

</ul>

Which jQuery code segmentinserts an item atthe beginning ofthe list?

$("ul").prepend("<li>Zero</li>");

Where should a search field be placed on a mobile site? 

Across the top

Given the following JavaScript:

var name = "student"; 

Which code statement sets the name variable to all uppercase characters?

name = name.toUpperCase();

Whatis the rst character a developer should use for an id selector in CSS?

#

What must follow the name of a function in a JavaScriptfunction declaration?

Parenthesis

Which syntax for a CSS class oats images to the right?

.floatright {

float: right;

margin: 7px;

} 

A developer needs two pixels of space on the left side of content relative to the border.

Which CSS property should this developer use?

padding-left:2px;

Which CSS selector defines an element with a class attribute equal to subject?

.subject

What is the outermost box of the CSS box model?

Margin

What uses predened code to add functionality to HTML5 pages?

Application programming interface (API)

Sends the browser forward (positive number) or backward (negative number) the specified number of pages in the

history

history.go(number)

Inserts content at the beginning of the selected elements

prepend() 

called when you drag a page element

dragover 

Draws a rectangular outline 

strokeRect(x,y,width,height)

a standard way to interact with files on the client machine using a Web browser

File API 

API that enables rendering of interactive 3D and 2D graphics in an HTML canvas, without the need for plug-ins in HTML5- compatible browsers

WebGL

Returns the number of URLs in the history for this browser window

history.length

 Functionality that allows a user to grab an object on a computer screen and move it to a different location on the screen.

drag-and-drop

provides a directory list of file objects. You can list information such as the file name, MIME type and size

. FileList

Cancels an ongoing watchPosition() call

clearWatch() 

Selects the first instance of the specified element (<a>) on a page 

$("a:first") 

. provides read-only access to individual files, such as images

FileReader

Selects all elements with the specified attribute (href)

$("[href]")

Sends the browser back one page in the history 

 history.back()

An API object used by scripting languages to send HTTP or HTTPS requests to a Web server; the server response is

loaded back into the script.

XMLHttpRequest 

. Draws a straight line from the current drawing position to the specified position (x,y)

lineTo(x,y) 

Changes the URL in the browser window by adding a URL to the history stack

 history.pushState(state object, title, url)

Draws an arcing (curving) line with a center (x,y), a given radius, a starting and ending angle (in radians), and instruction to draw

in a clockwise or counterclockwise direction 

arc(x,y,radius,startAngle,endAngle,anticlockwise)

Specifies a key-pair generator field used for forms. When the form is submitted, the private key is stored locally, and the public key is sent to the server. 

<keygen>

Sends the browser forward one page in the history

Sends the browser forward one page in the history

returns a context object, which provides properties and methods that can be used to draw and manipulate images on the

canvas. 

getContext()

The .class selector Selects elements with the specified class (e.g., demo)

$(".demo")

Ends the current drawing path

closePath()

method to prevent default action where data elements cannot be dropped in other elements

preventDefault()

An area of a Web page that has been defined as a place where dragged items can be placed

drop zone

for (var i = 0, x = files.length; i < x; ++i) 

loop that iterates through a set of files

Selects all instances of the specified element (<a>) with the specified attribute (target) and specified value (_blank

$("a[target='_blank']")

Sets or returns the text content of selected elements

text() 

 Inserts content at the end of the selected elements

append()

used to get and set attribute values

attr() 

 Moves the drawing pointer to a specified position (x,y)

moveTo(x,y

Selects the current HTML element 

$(this) 

API used for rendering visual images on the fly by providing scripts with a bitmap canvas. 

 canvas 

An event handler that is called when the history changes for a document in the browser window

 window.onpopstate

. Sets or returns the values of form fields

val() 

Adds a stroke (line) to the path drawn 

 stroke()

 A standard that specifies how objects in a Web document can be referred to and manipulated through scripting languages. 

Document Object Model (DOM)

called when a page element is dropped after being dragge

drop

A technique for transmitting data objects between a server and a Web application without disturbing page display. Uses HTML,

CSS, JavaScript and the DOM

AJAX

Returns the state object at the top of the history stack

history.state

Selects all HTML elements in the document

$("*")

 The element selectorSelects instances of the specified element (e.g., <a>) based on the element name

$("a")

A list of the files that are needed for the Web application to work offline

manifest

Selects all instances of the specified element () with the specified class (demo)

$("a.demo")

Inserts content before the selected elements

before() 

The ability to determine a user's location

geolocation

Fills the area with the color set by the fillStyle property

fill()

Retrieves the current geographic location of the user

getCurrentPosition()

provides the ability to divide a file into byte ranges

Blob (Binary Large Object)

Sets the thickness of the path drawn, in pixels 

lineWidth 

A program that permits the user to continue working with Web sites and documents even when a network connection is

unavailable

offline web applications

Inserts content after the selected elements

Inserts content after the selected elements

Draws a filled rectangle

 fillRect(x,y,width,height)

The #id selector Selects instances of elements based on the id attribute (e.g., custname) of the element

$("#custname") 

A collection of standards and programming instructions that enable access to a software application

 application programming interface (API)

Clears the specified area and makes it fully transparent

clearRect(x,y,width,height)

event listener to trigger the drag event.

 ondragstart

allows you to add, change and delete URLs and titles in the browser history field

History API

Used with jQuery commands to specify that the code will not run until the document has finished loading

document.ready

loop that iterates through a set of files

 for (var i = 0, x = files.length; i < x; ++i)

Retrieves periodic updates about the current geographic location of the user

watchPosition()

determines if the browser supports geolocation

 if (navigator.geolocation)

Replaces the current URL in the history with a new one, instead of adding another URL to the history stack

history.replaceState(state object, title, url)

Sets the fill color or style 

fillStyle 

JavaScript code that selects an HTML element using the ID attribute

document.getElementById("MyLocation") 

Sets or returns the content of selected elements (including HTML markup)

. html() 

Removes the selected element (and its child elements)

remove() 

JavaScript library used to simplify programming. 

jQuery

A directory on a computer where applications, such as Internet apps, can be stored and run without access to the original

application. 

application cache

 Either begins a drawing path or resets the current path 

beginPath() 

JavaScript

used to access the DOM

. Removes the child elements from the selected element 

empty()

An API object used by scripting languages to send HTTP or HTTPS requests to a Webserver; the server response is loaded back into the script. 

. XMLHttpRequest

 script added to a single HTML element

inline script

linking web pages to a text file with the .js file name extension

external script 

creates a pop-up box with the specified message string, which the user can dismiss by clicking a button in the box 

alert() 

variable declared outside of any function definition, usually at the start of your script

global variable

 a part of a statement that is evaluated as a value

expression

a programming language designed to enable computer users to write useful programs easily

scripting language

Occurs when a page is loaded into the browser (i.e., opened)

load

Occurs when the mouse pointer leaves a link, image or other visible element on a page 

mouseOut

creates a pop-up box with the specified message string and requests user confirmation (yes or no) by clicking the OK or Cancel button in the box

 confirm()

Operations will evaluate to true or false

Logical 

Occurs when the user moves the mouse pointer over a link, image or other visible element on a page

mouseOver

A reference technique used to access a property or method of an object. 

dot notation

Occurs when the loading of an image is aborted

abort

creates a pop-up box with the specified message string and requests user input into a text field in the box 

prompt()

specific qualities of properties

values

The actual data values you provide in JavaScript 

literal 

these are typically syntax errors. Load-time errors usually cause error alerts. 

 Load-time errors

A self-contained programming component that contains properties and methods needed to make a certain type of data useful

object 

Occurs when a form's Reset button is clicked

. reset

processes a function's statements

calling statement

used to determine whether an operand is a number

 isNaN()

Occurs when the user selects the text in a form field

. select

Assigns a value to a variable using the equal symbol (=)

Assignment

Occurs when a user gives input or focus to a form element

focus

used to assign values

=

 A standard that specifies how objects in a Web document can be referred to and manipulated through scripting languages.

Document Object Model (DOM)

. An interpreted programming language designed to simplify application development

scripting language

These are mathematical errors, casting errors, errors in proper command usage or errors in the structure of the script, which result in the script running improperly. Logic errors do not cause error alerts. The script may return unexpected results or may fail to execute at all. 

. Logic errors

converts a string to its floating-point decimal equivalent

parseFloat()

variable declared within a function and available only from within that function

local variable 

Compares two values and returns a true or false value

 Comparison

various attributes of an object, such as height, color, font size, sentence length and so forth. 

 properties

A special keyword for the null value (e.g., if a user enters nothing in a text box then submits the form, the text box has null value)

null

Mode that describes when values are passed to a function, and the function's parameters receive its argument's actual value

pass by reference

Occurs when a user changes the value of a form field 

change

a named space of memory

variable

convert a string value to uppercase letters

toUpperCase()

Occurs when input focus is removed from a form element (e.g., when a user clicks the mouse button outside of a particular field)

blur

writes the specified message string in the page

 document.write()

A value or expression containing data or code that is passed on to a function or procedure. Also called a parameter. 

argument

 combines text strings

concatenation

used to return values from a function

return

True or false values only

. Boolean 

Occurs when an error takes place while a page or image is loading

error

Any string of alphanumeric characters used for words or for numbered phrases that are not mathematically manipulated 

string 

 script added to a single web page within either the <head> or <body>

embedded script

converts a string to its integer equivalent 

parseInt() 

 Mode that describes when values are passed to a function, and the function's parameters receive a copy of its argument's value. 

pass by value 

actions that an object can be made to perform 

. methods

 Data that is to be operated upon or manipulated in some manner. 

operand

Makes decisions in a script; the expression (condition) will return either true or false, then evaluate the corresponding

expression 

Conditional

After the script has loaded and is running, an error occurs. These are typically caused by improper use of commands.

Run-time errors usually cause error alerts as well. 

Run-time errors

. Evaluates to a number

Arithmetic

a way of changing a variable from one data type to another

casting

a named set of statements that performs a task or calculates a value

. function

. JavaScript library used to simplify JavaScript programming. 

jQuery

symbols or characters used in expressions to store or evaluate a value

 operator

Occurs when a form's Submit button is clicked 

submit

Occurs when a variable has no value assigned yet 

. undefined 

 Occurs when the user clicks on a link or form element

click

Occurs when a page is unloaded from the browser (i.e., closed)

unload

Any numeric value used for mathematical operation

number

for Opera 

-o-

. Defines a 3D translation using specified parameters for positions on the X-axis, Y-axis and Z-axis

translate3d(x,y,z)

Defines a 3D rotation by specifying the degree for rotation for all axes

rotate3d(x,y,z,angle)

for Internet Explorer 

-ms-

Describes the speed of a transition

transition-timing-function

Specifies the weight or thickness of each character in the font

font-weight

. Moves the element along the Y-axis (vertically)

translateY(n) 

 Selects every disabled instance of a specified element

element:disabled

 Increases or decreases the size of the element, based on specified parameters for width (x) and height (y)

scale(x,y) 

Moves the element along the X-axis (horizontally)

translateX(n) 

Specifies a justification style for the last line in a text block whose text-align property is set to "justify"

text-align-last

 scaleY(y)

Defines a 3D scale transformation by specifying a value for the Y-axis

A W3C technology for applying formatting instructions to other markup language documents. 

 Cascading Style Sheets (CSS)

Selects every instance of a specified element whose specified attribute begins with the specified value

 element[attribute^=value]

technique used to place an HTML element on top of another HTML element 

. overlay

 Shorthand property for all the animation properties, except animation-play-state

animation

Selects every instance of a specified element that is the last of its parent 

element:last-of-type

Turns or skews the element to a specified angle, based on the specified parameters for the horizontal (x) and vertical (y) lines 

skew(x-angle,y-angle)

Specifies how an animation progresses over one cycle

animation-timing-function

Specifies whether child elements will retain the parent element's position in 3D space

. transform-style

selects elements with a specific class attribute

class selector

Creates outlined characters for text

text-outline 

Changes the element's height

scaleY(n)

Selects every enabled instance of a specified element

element:enabled

Specifies the tabbing order for an element 

. nav-index

Allows you to change a transformed element's position 

transform-origin

. a specific selection for a property

value

 Specifies the identifier for the @keyframes animation that binds it to a selector

animation-name

. Cuts off, or clips, text that extends beyond its container

text-overflow

Defines a 3D scale transformation by specifying a value for the X-axis 

. scaleX(x)

Sets the four transition properties into a single property

transition

consists of a property and a value

declaration

Specifies where the cursor will navigate to when the user presses the arrow

nav-right

Specifies that long words in a text area may be broken without a hyphen and wrap to the next line

. word-wrap

Specifies where the cursor will navigate to when the user presses the arrow-left key

nav-left

specifies CSS styles for elements based on a certain state

 pseudo selector 

Selects every instance of a specified element whose specified attribute contains the specified substring value

element[attribute*=value]

Turns or skews the element to a specified angle along its Y-axis 

skewY(angle)

Defines whether an element can be resized by the user and how it can be resized

. resize 

Selects every instance of a specified element whose specified attribute ends with the specified value

element[attribute$=value]

. Specifies how the font should be stretched or spaced

font-stretch

Style added directly into the HTML element tag to which you want to apply the style. These styles are applied to elements

individually. 

Inline styles 

Positions the background-image relative to an element's border, padding or content

background-origin

Specifies whether lines of text in a text area can break, and where a line can be broken. This property is no longer supported. 

text-wrap

Specifies whether (and how) punctuation characters can be trimmed or sized when they appear at the beginning or end of a line

punctuation-trim

Defines the amount of time that a transition takes

 transition-duration

Defines a 3D translation using only the value for the Z-axis

 translateZ(z)

Makes an element look like a standard user interface element, such as a button or window

appearance

Specifies where the cursor will navigate to when the user presses the arrow-down key

nav-down

Defines whether or not an element is visible when it is rotated to face away from the viewer

backface-visibility 

Specifies whether (and how) punctuation characters can appear outside the line box at the beginning or end of a full line of text

 hanging-punctuation

Creates a border that uses an image instead of a line

border-image

Defines the shape or curve of a border around an element

border-radius

Specifies the number of times that the animation will play

animation-iteration-count

Specifies the range of UNICODE characters that should be downloaded for the font, based on availability

unicode-range 

Styles an element with an iconic equivalent 

. icon

Changes the element's width 

@keyframes

Rotates the element around its Z-axis at the specified degree

rotateZ(angle)

Defines a 3D translation using only the value for the X-axis

translateX(x) 

specifies CSS styles for HTML elements based on the element name

tag selector 

 Specifies how long the animation will take to complete one cycle 

animation-duration

Specifies whether the animation is running or paused

animation-play-state

Rotates the element around its Y-axis at the specified degree 

rotateY(angle) 

Specifies the bottom position of a 3D element

. perspective-origin

 a format instruction that consists of a specified selector and the properties and values applied to it

rule

a text file that contains CSS formatting instructions

External style sheet 

styles added to the <head> of individual an HTML document

Embedded or Internal style sheet 

Specifies when the animation will begin 

animation-delay

Specifies the perspective from which a 3D child element is viewed by defining how far it is placed from view (in pixels) 

perspective

Specifies how the font should be styled vertical or slanted 

font-style

Specifies a justification style for text whose text-align property is set to "justify"

 text-justify

Rotates the element around its X-axis at the specified degree

 rotateX(angle) 

Specifies whether lines of text in a text area can break, and where a line can be broken

word-break

Defines the size of background images

background-size

Draws an outline beyond the border edge as specified

outline-offset

Defines a 3D transformation using a 4x4 matrix of 16 values

matrix3d(n,n,n,n,n,n,n,n,n,n,n, n,n,n,n,n)

Selects every instance of a specified element that is the first of its parent

element:first-of-type

allows developers to specify custom fonts for their Web page elements

2. @font-face

Specifies the CSS property that the transition will affect 

translateX(x) 

Selects every instance of element2 that is preceded by an instance of element1

element1~element2

Moves the element from its current position, based on the specified parameters for the left (x) and top (y) position

translate(x,y)

. transform

Applies a 2D or 3D transformation to an element, including rotating, moving, skewing, scaling and so forth

Defines a 3D scale transformation by specifying a value for the Z-axis

scaleZ(z)

Selects every disabled instance of a specified element 

value

Specifies the CSS property that the transition will affect

transition-property

specifies the stack order of an element

z-index

Combines all of the 2D transform methods into one

. matrix(n,n,n,n,n,n)

Specifies the painting area of the background. Determines whether the background extends into the border or not

. background-clip 

Defines when the transition will begin 

transition-delay

for Chrome, Safari and iOS 

-webkit-

Turns or skews the element to a specified angle along its X-axis 

skewX(angle) 

Applies shadows to edges of text characters to create visual depth 

text-shadow

 Defines a 3D translation using only the value for the Y-axis

translateY(y)

. Defines a perspective view for a 3D transformed element

perspective(n)

Specifies how form input should be encoded when submitted to the server

formenctype

Specifies the maximum number of characters that can be entered in the field by the user

maxlength 

pattern for latitude/longitude

 <input type="text" pattern="-?\d{1,3}\.\d+"> 

Provides a hint to the user of the input value expected in the field

placeholder

stored locally on the user's computer

private key

pogo-sticking 

Occurs when users must submit and resubmit a form until it validates

Allows the user to choose a date and time with a local time zone

<input type="datetime-local"> 

Specifies the HTTP method for sending form input to the formaction attribute's URL value

formmethod

Allows the user to enter numbers using a slider control

<input type="range">

rectangular field that can expand upon user interaction and allow users to select one or more pre-determined choices 

Drop-down select list 

pattern for a URL

<input type="url" pattern="https?://.+">

Allows the user to enter one or more e-mail addresses 

<input type="email">

recognizes text input and completes the text entry automatically

autocomplete

Requires the user to select or enter a value before the form can be submitted 

required

round buttons in a group of mutually exclusive pre-determined choices

Radio buttons

Allows the user to enter a URL, such as an http://, ftp:// or mailto: address

<input type="url">

Allows the user to choose a date using the month and year (without time zone) 

<input type="month">

Adds security to a form through asymmetric encryption by creating a key-pair generator field in the form

<keygen>

rectangle field into which users can type alphanumeric characters of their choice

Text box

Allows the user to enter a date (without time zone) using a drop-down date-picker calendar 

<input type="date">

Applies focus on the element when the page loads

autofocus

used to group elements so that related fields are placed together in a form 

<fieldset>

a process that tests data input by users in a Web form to verify whether the input follows a specified format or meets minimum requirements for character number or type.

User input validation 

<input type="tel">

Allows the user to enter a phone number 

Specifies a name or keyword that indicates where to display the response to the user after s/he has submitted the form

formtarget

Checks input into the field against a regular expression, which is a pattern of characters for use in pattern-matching and search-and-replace functions 

pattern

Specifies where to send user input when the form is submitted

formaction

Allows the user to choose a date and time with a GMT time zone

<input type="datetime">

An attribute used by many different elements.

global attribute

Requires input in the field before the form can be submitted

required

Allows the user to enter more than one value in the element 

multiple

Specifies a name for the element that can be used to reference it

name

square buttons in a group of pre-determined choices from which the user can select more than one choice

Check boxes

Specifies the IDs of elements whose values were used

for 

enables you to add a label to an input element in a form 

 <label>

A type of user input validation in which the user input in each field of a form is validated as the user completes it, before the form is submitted. 

inline validation

Specifies whether text submitted in a form field is to be wrapped 

wrap

Specifies a list of pre-defined choices for an element

. . <datalist>

Specifies the form(s) on the page in which the element appears

form

Disables the element 

disabled

allows you to add a caption for a group of items created by the element

<legend>

Refers to pre-defined options contained in a datalist

. list

Specifies a short description to provide the user with a hint about the expected input in the field

placeholder

The backward-compatibility of code; its ability to render an acceptable substitute on the page when older or noncompatible browsers cannot support newer HTML features 

graceful degradation 

Directs the browser not to validate form data upon submission

novalidate

buttons typically found at the bottom of forms used for either submitting the form or clearing all user input from the form

Submit and Reset buttons

used to designate the beginning of a form on a page 

<form> 

Allows the user to enter rational integers or float values 

 <input type="number">

Defines the minimum or maximum value for an element

min max

Allows the user to choose colors

 <input type="color">

submits a user's completed form data to the server for processing 

 <button type="submit">

Allows the user to enter text for a search query

<input type="search">

pattern for an email address

<input type="email" pattern="^.+@.+$">

pattern for a date

<input type="text" pattern="\d{1,2}/\d{1,2}/\d{4}">

. Semantic input types

input fields that describe their content to developers as well as browsers 

Allows the user to choose a date using the week and year (without time zone)

. <input type="week">

specifies that a field must be completed before form submission 

required

Defines the maximum length of input allowed in an field

maxlength

ensure that certain types of form data are entered correctly, such as dates, e-mail addresses, prices and URLs

pattern

Directs the form not to validate upon submission

formnovalidate 

Displays the result when a calculation is performed

<output> 

sent to the Web site's server to match the user's key

public key