HTML and CSS Reference
In-Depth Information
Figure 10.14
A submit button created using the
<button>
element
Other Inputs
Besides the applications we've just discussed, the
<input>
element has a few other use
cases. These include passing hidden data and attaching files during form processing.
Hidden Input
Hidden inputs provide a way to pass data to the server without displaying it to users. Hid-
den inputs are typically used for tracking codes, keys, or other information that is not per-
tinent to the user but is helpful when processing the form. This information is not displayed
on the page; however, it can be found by viewing the source code of a page. It should there-
fore not be used for sensitive or secure information.
To create a hidden input, you use the
hidden
value for the
type
attribute. Additionally,
include the appropriate
name
and
value
attribute values.
1.
<input
type="hidden" name="tracking-code" value="abc-123"
>
File Input
To allow users to add a file to a form, much like attaching a file to an email, use the
file
1.
<input
type="file" name="file"
>
Figure 10.15
An input to upload a file created by way of the
<input>
element with a
type
attribute value of
file
Unfortunately, styling an
<input>
element that has a
type
attribute value of
file
is a
tough task with CSS. Each browser has its own default input style, and none provide much
control to override the default styling. JavaScript and other solutions can be employed to
allow for file input, but they are slightly more difficult to construct.
Search WWH ::
Custom Search