Attributes do not require quotation marks around them if they contain only the following characters:
But the spec recommends that they are used anyway.
& should be used in place of & in attributes as well as in the html text - remember this for the href attribute with certain complex links.
The following code is allowed in strict HTML 4.01 even though it seems to me that it's only about visual formatting:
The following tags are allowed in loose /transitional HTML 4.01 but not in strict HTML:
Types of form element:
Radio buttons in a group are mutually exclusive: when one is switched "on", all the others are switched "off". They must share the same value for the attribute name.
The HTML 2.0 spec states:
"At all times, exactly one of the radio buttons in a set is checked. If none of the <input> elements of a set of radio buttons specifies 'checked', then the user agent must check the first radio button of the set initially."
However the HTML 4.01 spec states:
"If no radio button in a set sharing the same control name is initially 'on', user agent behavior for choosing which control is initially 'on' is undefined."
Since user agent behavior differs, it is recommended practice to ensure that one button in each set of radio buttons is initially "on" using the attribute checked.
Taken from: HTML 4.01 specification
Drop-down lists are made using the <select> tag, which must be closed. The items in the list are given using <option>.
If the boolean attribute multiple is specified, multiple selections are allowed. If it is not specified, the <select> element only allows a single selection.
The selected attribute is used to indicate which item is initially selected. The spec for pre-selection has changed in the same way as the spec for pre-checking for radio buttons.
If a <select> element is presented as a scrolled list box, the size attribute specifies the number of rows in the list which 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.
The <button> tag was introduced in HTML 4.0. It offers more and better styling possibilities than <input type="button">. The syntax is more similar to <textarea> - it requires a closing tag and the text on the button goes between the tags rather than using the value attribute.
The readonly attribute specifies whether a control can be modified by the user. When set, it has the following effects on an element:
The disabled attribute disables a control for user input. When set, it has the following effects on an element:
Taken from: HTML 4.01 specification
Notes:
The "for" attribute of the label must be the same as the "id" attribute of the field.
class="formcontrol" is only used when there is more than one form control associated with the text (typically check boxes and radio buttons). It gives improved wrapping. If there is only one form control (typically text and message boxes), better wrapping is achieved by not using this.
<form id="" method="" action="" title=""> <div> <input type="hidden" name="" value=""> </div> <div>Fields marked with * are required.</div> <fieldset> <legend>Details</legend> <div class="formline"> <label for="n" accesskey="N" class="formlabel"> * <span class="access">N</span>ame: </label> <input id="n" type="text" name="realname" value="" size="34"> </div> <div class="formline"> <label for="d" accesskey="D" class="formlabel">* <span class="access">D</span>isguise:</label> <input id="d" type="password" name="disguise" value="" size="34"> </div> <div class="formline"> <label for="m" accesskey="M" class="formlabel"> * <span class="access">M</span>essage: </label> <textarea id="m" name="Message" cols="36" rows="8">Default text</textarea> </div> <div class="formline"> <label for="l" accesskey="P" class="formlabel"> <span class="access">P</span>lace: </label> <span class="formcontrol"> <span class="nowrap"> <label for="l" accesskey="L"><span class="access">L</span>ondon:</label> <input id="l" type="radio" name="place" value="London"> </span> <span class="nowrap"> <label for="u" accesskey="U"><span class="access">U</span>K:</label> <input id="u" type="radio" name="place" value="UK"> </span> <span class="nowrap"> <label for="e" accesskey="E"><span class="access">E</span>lsewhere:</label> <input id="e" type="radio" name="place" value="Elsewhere" checked> </span> </span> </div> <div class="formline"> <label for="b" accesskey="B" class="formlabel"><span class="access">B</span>orough:</label> <select id="b" name="borough"> <optgroup label="Barnet and Camden"> <option value="Barnet">Barnet</option> <option value="Camden">Camden</option> </optgroup> <optgroup label="Bexley and Bromley"> <option value="Bexley">Bexley</option> <ption value="Bromley">Bromley</option> </optgroup> </select> </div> <div class="formline"> <label for="h" accesskey="I" class="formlabel"> <span class="access">I</span>nformation: </label> <span class="formcontrol"> <span class="nowrap"> <label for="h" accesskey="H"><span class="access">H</span>TML:</label> <input id="h" type="checkbox" name="HMTL" value="yes"> </span> <span class="nowrap"> <label for="x" accesskey="X">CSS synta<span class="access">x</span>:</label> <input id="x" type="checkbox" name="CSS" value="yes"> </span> <br> <span class="nowrap"> <label for="j" accesskey="J"><span class="access">J</span>avaScript</label> <input id="j" type="checkbox" name="JavaScript" value="yes"> </span> <span class="nowrap"> <label for="a" accesskey="A"><span class="access">A</span>ccessibility</label> <input id="a" type="checkbox" name="Accessibility" value="yes"> </span> </span> </div> </fieldset> <div class="formbuttons"> <button type="submit" accesskey="S">Send</button> <button type="reset" accesskey="C">Clear</button> </div> </form>
See my CSS for forms.