Leyendas, campos, formularios y selectores

Todo en la misma entrada: así me ahorro el tener que repetir en otras :D

Wordpress tiene bastante más interés que Blogger en satisfacer las demandas de sus usuarios, de manera que yo me paso las horas muertas por esos lares, para poder aplicar por aquí lo que aprendo allá.

Y, en el caso que nos ocupa, vamos con la muestra:

---

Fieldsets, Legends, and Form Elements

Legend

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.

Form Element

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui.

Text Field:

Text Area:

Select Element:

Option 1
Option 2
Option 3


Option 1

Option 2
Option 3

Radio Buttons:

Radio 1

Radio 2


Radio 3

Checkboxes:

Radio 1

Radio 2

Radio 3

Password:

File Input:

... Que consegiomos de la siguiente forma:

<hr>

<h1 class="sIFR-replaced" id="form_elements"><embed style="width: 398px; height: 26px;" class="sIFR-flash" type="application/x-shockwave-flash" sifr="true" bgcolor="transparent" wmode="transparent" flashvars="txt=fieldsets, legends, and form elements&amp;textcolor=#000000&amp;hovercolor=#003399&amp;linkcolor=#070707&amp;w=398&amp;h=26" quality="best" src="http://.../y2k.swf" height="26" width="398"></embed><span class="sIFR-alternate">Fieldsets, Legends, and Form Elements</span></h1>

<p></p><fieldset><br>



<legend>Legend</legend>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui. Nam sit amet sem. Aliquam libero nisi, imperdiet at, tincidunt nec, gravida vehicula, nisl. Praesent mattis, massa quis luctus fermentum, turpis mi volutpat justo, eu volutpat enim diam eget metus.</p>

<form>

<h2 class="sIFR-replaced"><embed style="width: 374px; height: 38px;" class="sIFR-flash" type="application/x-shockwave-flash" sifr="true" bgcolor="transparent" wmode="transparent" flashvars="txt=form element&amp;textcolor=#000000&amp;hovercolor=#003399&amp;linkcolor=#070707&amp;w=374&amp;h=38" quality="best" src="http://.../y2k.swf" height="38" width="374"></embed><span class="sIFR-alternate">Form Element</span></h2>

<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est. Quisque aliquam. Donec faucibus. Nunc iaculis suscipit dui.</p>

<p><label for="text_field">Text Field:</label></p>

<input id="text_field" type="text">

<p><label for="text_area">Text Area:</label><br>

<textarea id="text_area"></textarea></p>



<p><label for="select_element">Select Element:</label></p>

<select name="select_element">

<optgroup label="Option Group 1"></optgroup>

<option value="1">Option 1</option>

<option value="2">Option 2</option>

<option value="3">Option 3</option>



<optgroup label="Option Group 2"></optgroup>

<option value="1">Option 1</option>



<option value="2">Option 2</option>

<option value="3">Option 3</option>



</select>



<p><label for="radio_buttons">Radio Buttons:</label></p>

<input class="radio" name="radio_button" value="radio_1" type="radio"> Radio 1<br>

<input class="radio" name="radio_button" value="radio_2" type="radio"> Radio 2<br>



<input class="radio" name="radio_button" value="radio_3" type="radio"> Radio 3<br>



<p><label for="checkboxes">Checkboxes:</label></p>

<input class="checkbox" name="checkboxes" value="check_1" type="checkbox"> Radio 1<br>

<input class="checkbox" name="checkboxes" value="check_2" type="checkbox"> Radio 2<br>

<input class="checkbox" name="checkboxes" value="check_3" type="checkbox"> Radio 3<br>



<p><label for="password">Password:</label></p>



<input class="password" name="password" type="password">

<p><label for="file">File Input:</label></p>

<input class="file" name="file" type="file">

<p>

<input class="button" value="Clear" type="reset">

<input class="button" value="Submit" type="submit"></p></form>

Pd: La parte que se refiere al "embed" de SIFR (es decir: de apertura de "embed" y2k.swf al cierre) os la podéis saltar alegremente y a la torera... porque sólo es para aplicar a las cabeceras el flash Sifr.