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

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

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

Page 1: 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

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

Etiqueta form

<form>.input elementos.</form>

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

input

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

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

radio

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

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

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>

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

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>

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

submit

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

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

FieldSet

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

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

Select

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

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

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>

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

Button

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

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

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>

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

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>

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