DISEÑO DE PÁGINAS WEB HTML Y CSS Tema 5: Formularios Jose Miguel Vidagany Igual.

Post on 01-Jan-2016

225 views 2 download

Tags:

Transcript of DISEÑO DE PÁGINAS WEB HTML Y CSS Tema 5: Formularios Jose Miguel Vidagany Igual.

DISEÑO DE PÁGINAS WEB HTML Y CSS

Tema 5: Formularios

Jose Miguel Vidagany Igual

Etiqueta form

<form>.input elementos.</form>

input

<form>First name: <input type="text" name="firstname"><br>Last name: <input type="text" name="lastname">Password: <input type="password" name="pwd"></form>

radio

<form><input type="radio" name="sex" value="male">Male<br><input type="radio" name="sex" value="female">Female</form>

checkbox

<form><input type="checkbox" name="vehicle" value="Bike">I have a bike<br><input type="checkbox" name="vehicle" value="Car">I have a car </form>

checkbox

<form><input type="checkbox" name="vehicle" value="Bike">I have a bike<br><input type="checkbox" name="vehicle" value="Car">I have a car </form>

submit

<form name="input" action="html_form_action.asp" method="get">Username: <input type="text" name="user"><input type="submit" value="Submit"></form>

FieldSet

<form> <fieldset> <legend>Personalia:</legend> Name: <input type="text"><br> Email: <input type="text"><br> Date of birth: <input type="text"> </fieldset></form>

Select

<select> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option></select>

Select multiple

<select multiple> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="opel">Opel</option> <option value="audi">Audi</option></select>

Button

<button type="button">Click Me!</button>

label

<form action="demo_form.asp"> <label for="male">Male</label> <input type="radio" name="sex" id="male" value="male"><br> <label for="female">Female</label> <input type="radio" name="sex" id="female" value="female"><br> <input type="submit" value="Submit"></form>

textarea

<textarea rows="4" cols="50">At w3schools.com you will learn how to make a website. We offer free tutorials in all web development technologies. </textarea>