Difference between revisions of "ARIA Textbox"

From Level Access Web Labs
Jump to navigation Jump to search
(Created page with "<html lang="en"> <head> <title>ARIA Textbox Example</title> <style> Styles the size of level 1 heading elements: h1 { font-size: 14px; } </style> <s...")
 
Line 19: Line 19:
 
 
 
<h1>Textbox with ARIA attributes</h1>
 
<h1>Textbox with ARIA attributes</h1>
<label id="aria-text-label" for="aria-text">ARIA Example:</label><br />
+
<p> This box uses the aria-labelledby attribute and the aria-multiline attribute.
<textarea rows="4" cols="50" aria-labelledby="aria-text-label" id="aria-text" role="textbox" aria-multiline="true"></textarea>
+
<p id="aria-text-label" for="aria-text">ARIA Example:</p> <textarea rows="4" cols="50" aria-labelledby="aria-text-label" id="aria-text" role="textbox" aria-multiline="true"></textarea>
 
 
<!-- The textbox role should be used on an input that allows free-form text as its value. -->
+
  <!-- The textbox role should be used on an input that allows free-form text as its value. -->
<!-- The aria-multiline property indicates whether a text box accepts multiple lines of input or only a single line. -->
+
  <!-- The aria-multiline property indicates whether a text box accepts multiple lines of input or only a single line. -->
 
</form>
 
</form>
 
</body
 
</body

Revision as of 18:20, 26 March 2014

ARIA Textbox Example

Standard textbox using the HTML <textarea> tag and no ARIA attributes


Textbox with ARIA attributes

This box uses the aria-labelledby attribute and the aria-multiline attribute.

ARIA Example: