0% found this document useful (0 votes)
30 views

17.5 The BUTTON Element: Start Tag: Required, End Tag: Required Attribute Definitions

The document describes the BUTTON and SELECT elements. The BUTTON element creates a push button and can contain text or other elements like images. It functions like an INPUT button but allows richer content. The SELECT element creates a drop-down menu or list box. It must contain one or more OPTION elements to represent the choices. OPTGROUP can group related OPTIONS to help users navigate a long list.

Uploaded by

Dave Aguila
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
30 views

17.5 The BUTTON Element: Start Tag: Required, End Tag: Required Attribute Definitions

The document describes the BUTTON and SELECT elements. The BUTTON element creates a push button and can contain text or other elements like images. It functions like an INPUT button but allows richer content. The SELECT element creates a drop-down menu or list box. It must contain one or more OPTION elements to represent the choices. OPTGROUP can group related OPTIONS to help users navigate a long list.

Uploaded by

Dave Aguila
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

17.

5 The BUTTON element


<!ELEMENT BUTTON - (%flow;)* -(A|%formctrl;|FORM|FIELDSET)
-- push button -->
<!ATTLIST BUTTON
%attrs;
-- %coreattrs, %i18n, %events -name
CDATA
#IMPLIED
value
CDATA
#IMPLIED -- sent to server when submitted -type
(button|submit|reset) submit -- for use as form button -disabled
(disabled)
#IMPLIED -- unavailable in this context -tabindex
NUMBER
#IMPLIED -- position in tabbing order -accesskey
%Character;
#IMPLIED -- accessibility key character -onfocus
%Script;
#IMPLIED -- the element got the focus -onblur
%Script;
#IMPLIED -- the element lost the focus ->

Start tag: required, End tag: required


Attribute definitions
name = cdata [CI]
This attribute assigns the control name.
value = cdata [CS]
This attribute assigns the initial value to the button.
type = submit|button|reset [CI]
This attribute declares the type of the button. Possible values:
submit: Creates a submit button. This is the default value.
reset: Creates a reset button.
button: Creates a push button.
Attributes defined elsewhere
id, class (document-wide identifiers)
lang (language information), dir (text direction)
title (element title)
style (inline style information)

disabled (disabled input controls)


accesskey (access keys)
tabindex (tabbing navigation)
onfocus, onblur, onclick, ondblclick, onmousedown, onmouse
up, onmouseover, onmousemove, onmouseout, onkeypress,onkey
down, onkeyup (intrinsic events)
Buttons created with the BUTTON element function just like buttons created
with the INPUT element, but they offer richer rendering possibilities:
the BUTTON element may have content. For example, a BUTTON element that
contains an image functions like and may resemble an INPUT element
whose type is set to "image", but the BUTTON element type allows content.
Visual user agents may render BUTTON buttons with relief and an up/down
motion when clicked, while they may render INPUT buttons as "flat" images.
The following example expands a previous example, but
creates submit and reset buttons with BUTTON instead of INPUT. The buttons
contain images by way of the IMG element.
<FORM action="http://somesite.com/prog/adduser" method="post">
<P>
First name: <INPUT type="text" name="firstname"><BR>
Last name: <INPUT type="text" name="lastname"><BR>
email: <INPUT type="text" name="email"><BR>
<INPUT type="radio" name="sex" value="Male"> Male<BR>
<INPUT type="radio" name="sex" value="Female"> Female<BR>
<BUTTON name="submit" value="submit" type="submit">
Send<IMG src="/icons/wow.gif" alt="wow"></BUTTON>
<BUTTON name="reset" type="reset">
Reset<IMG src="/icons/oops.gif" alt="oops"></BUTTON>
</P>
</FORM>

Recall that authors must provide alternate text for an IMG element.
It is illegal to associate an image map with an IMG that appears as the
contents of a BUTTON element.
ILLEGAL EXAMPLE:
The following is not legal HTML.

<BUTTON>
<IMG src="foo.gif" usemap="...">
</BUTTON>

17.6 The SELECT, OPTGROUP, and OPTION elements


<!ELEMENT SELECT - - (OPTGROUP|OPTION)+ -- option selector -->
<!ATTLIST SELECT
%attrs;
-- %coreattrs, %i18n, %events -name
CDATA
#IMPLIED -- field name -size
NUMBER
#IMPLIED -- rows visible -multiple
(multiple)
#IMPLIED -- default is single selection -disabled
(disabled)
#IMPLIED -- unavailable in this context -tabindex
NUMBER
#IMPLIED -- position in tabbing order -onfocus
%Script;
#IMPLIED -- the element got the focus -onblur
%Script;
#IMPLIED -- the element lost the focus -onchange
%Script;
#IMPLIED -- the element value was changed ->

Start tag: required, End tag: required


SELECT Attribute definitions
name = cdata [CI]
This attribute assigns the control name.
size = number [CN]
If a SELECT element is presented as a scrolled list box, this attribute
specifies the number of rows in the list that should be visible at the
same time. Visual user agents are not required to present
a SELECT element as a list box; they may use any other mechanism,
such as a drop-down menu.
multiple [CI]
If set, this boolean attribute allows multiple selections. If not set,
the SELECT element only permits single selections.
Attributes defined elsewhere
id, class (document-wide identifiers)
lang (language information), dir (text direction)
title (element title)
style (inline style information)

disabled (disabled input controls)


tabindex (tabbing navigation)
onclick, ondblclick, onmousedown, onmouseup, onmouseover,
onmousemove, onmouseout, onkeypress, onkeydown, onkeyup(int
rinsic events)
The SELECT element creates a menu. Each choice offered by the menu is
represented by an OPTION element. A SELECT element must contain at least
one OPTION element.
The OPTGROUP element allows authors to group choices logically. This is
particularly helpful when the user must choose from a long list of options;
groups of related choices are easier to grasp and remember than a single
long list of options. In HTML 4, all OPTGROUPelements must be specified
directly within a SELECT element (i.e., groups may not be nested).

You might also like