| (2 intermediate revisions by the same user not shown) | |||
| Line 2: | Line 2: | ||
image | image | ||
===Type=== | ===Type=== | ||
| − | + | input | |
===Synopsis=== | ===Synopsis=== | ||
A graphical submit button | A graphical submit button | ||
===Description=== | ===Description=== | ||
| − | + | input elements of type image are used to create graphical submit buttons, i.e. submit buttons that take the form of an image rather than text. | |
===Parameters=== | ===Parameters=== | ||
type="image" | type="image" | ||
| Line 13: | Line 13: | ||
===Example=== | ===Example=== | ||
<syntaxhighlight lang="html"> | <syntaxhighlight lang="html"> | ||
| − | < | + | <fieldset style="border:1px solid #eee; padding:15px;"> |
| − | < | + | <legend>Sign in</legend> |
<p>Sign in to your account:</p> | <p>Sign in to your account:</p> | ||
<div> | <div> | ||
| − | < | + | <label for="userId">User ID</label> |
| − | < | + | <input type="text" id="userId" name="userId" /> |
</div> | </div> | ||
| − | < | + | <input type="image" id="image" alt="Login" |
src="//{{filepath:Login-btn-example.png|nowiki}}" /> | src="//{{filepath:Login-btn-example.png|nowiki}}" /> | ||
| − | </ | + | </fieldset> |
</syntaxhighlight> | </syntaxhighlight> | ||
| − | < | + | <fieldset style="border:1px solid #eee; padding:15px;"> |
| − | < | + | <legend>Sign in</legend> |
<p>Sign in to your account:</p> | <p>Sign in to your account:</p> | ||
<div> | <div> | ||
| − | < | + | <label for="userId">User ID</label> |
| − | < | + | <input type="text" id="userId" name="userId" /> |
</div> | </div> | ||
| − | < | + | <input type="image" id="image" alt="Login" |
src="{{filepath:Login-btn-example.png|nowiki}}" /> | src="{{filepath:Login-btn-example.png|nowiki}}" /> | ||
| − | </ | + | </fieldset> |
===Note=== | ===Note=== | ||
===Links=== | ===Links=== | ||
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/image | https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/image | ||
| ws-class-props | |||
|---|---|---|---|
| Line 1: | Line 1: | ||
{{Doc properties | {{Doc properties | ||
| − | |Subject version=2.0 | + | |Subject version=2.0,2.1 |
|Doc subject=DevOps:Doc/FlexForm | |Doc subject=DevOps:Doc/FlexForm | ||
|Doc parent=DevOps:Doc/FlexForm/1.0/input | |Doc parent=DevOps:Doc/FlexForm/1.0/input | ||
|Doc sort order=110 | |Doc sort order=110 | ||
|Doc target group=User | |Doc target group=User | ||
| + | |Doc synopsis=A graphical submit button | ||
}} | }} | ||
Latest revision as of 22:04, 31 March 2023
Name
image
Type
input
Synopsis
A graphical submit button
Description
input elements of type image are used to create graphical submit buttons, i.e. submit buttons that take the form of an image rather than text.
Parameters
type="image"
All other valid parameters for an input field are valid. Additionally you can use min, max, step and list.
Example
<fieldset style="border:1px solid #eee; padding:15px;">
<legend>Sign in</legend>
<p>Sign in to your account:</p>
<div>
<label for="userId">User ID</label>
<input type="text" id="userId" name="userId" />
</div>
<input type="image" id="image" alt="Login"
src="//{{filepath:Login-btn-example.png|nowiki}}" />
</fieldset>
Note
Links
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/image
