SlideShare una empresa de Scribd logo
1 de 4
Colegio nacional Nicolás esguerra
Daniel pachón ángel
Edward neuta Arévalo
Página web IX
FORMULARIOS
Formulario <form>
Un formulario es un elemento que permite recoger datos introducidos por el usuario.
Los formularios se utilizan para conocer las opiniones, dudas, y otra serie de datos sobre
los usuarios, para introducir pedidos a través de la red, tienen multitud de aplicaciones.
Un formulario está formado, entre otras cosas, por etiquetas, campos de texto, menús
desplegables, y botones.
Es muy recomendable utilizar tablas para organizar los elementos de los formularios.
Utilizando tablas se consigue una mejor distribución de los elementos del formulario, lo que
facilita su comprensión y mejora su apariencia.
Los formularios se insertan a través de las etiquetas <form> y </form>. Entre dichas
etiquetas habrá que insertar los diferentes objetos que formarán el formulario. la etiqueta
<form> tiene los siguientes atributos:
El atributo action indica una dirección de correo electrónico a la que mandar el formulario,
o la dirección del programa que se encargará de procesar el contenido del formulario.
El atributo enctype indica el modo en que será cifrada la información para su envío. Por
defecto tiene el valor application/x-www-form-urlencoded.
El atributo method indica el metodo mediante el que se transferirán las variables del
formulario. Su valor puede ser get o post.
El valor get se utiliza cuando no se van a producir cambios en ningún documento o
programa que no sea el navegador del usuario que pretende mandar el formulario, como
ocurre cuando se realizan consultas sobre una base de datos.
El valor post se utiliza cuando sí se van a producir cambios, como ocurre cuando el usuario
manda datos que deben ser almacenados en una base de datos.
Se recomienda utilizar el valor post.
Por ejemplo, podríamos insertar un formulario escribiendo el siguiente código:
<form action="mailto:formularios@aulaclic.com" method="post"
enctype="text/plain" >
...
</form>
A continuación veamos los distintos elementos que se pueden incluir en un formulario.
Áreas de texto <textarea>
Las áreas de texto permiten a los usuarios insertar varias líneas de texto. Por ello, suelen
utilizarse para que incluyan comentarios.
Para insertar un área de texto es necesario incluir las etiquetas <textarea> y </textarea>
entre las etiquetas <form> y </form> del formulario.
Para que el área de texto tenga algún valor inicial, habrá que insertarlo entre las etiquetas
<textarea> y </textarea>.
El atributo name indica el nombre del área de texto. Es necesario dar nombres diferentes a
cada uno de los elementos de un formulario, para poder identificarlos a la hora de
procesarlos.
El atributo rows indica el número de líneas que podrán ser visualizadas en el área de texto
por lo que determina al alto del área de texto.
El atributo cols indica el número de caracteres por línea que podrán ser visualizados en el
área de texto por lo que determina al ancho del área de texto.
Gracias a las barras de desplazamiento, es posible insertar más líneas de las especificadas
en el atributo rows, y más caracteres por línea de los especificados en el atributo cols.
Por ejemplo, para insertar el área de texto:
Escribe el texto que quieras
Habría que escribir: <textarea name="ejemploarea" cols="30" rows="3">Escribe el
texto que quieras</textarea>
RESULTADO:
CODIGO:
<html>
<head>
</title>airjordan905</title>
</head>
<!--estapaginawebeselaboradapordaniel pachonangel yedwardneuta905//-->
<bodybgcolor="green">
<hr>
<marquee bgcolor="yellow"behavior="alternatedirection="right"><h3>BIENVENIDOSA NUESTRA
EMPRESA AIRJORDAN </MARQUEE><br>
<hr>
nuestraempresabrindaserviciosde calidad<br>
<br>
<inputname="tunombre"type="text"value="tue-mail"size="20"maxlength="15">
<inputname="tue-mail"type="password"value="contraseña"size="20"maxlength="15">
<inputname="ciclo"type="submit"value="Enviar">
<inputname="casilla"type="checkbox"value="acepto"checked>
<inputname="prefiere"type="radio"value="estudiar"checked>
<inputname="prefiere"type="radio"value="trabajar">
<inputname="prefiere"type="radio"value="estudiar"checked>
<inputname="prefiere"type="radio"value="trabajar">
<selectname="calzado">
<optionselected>---calzado---</option>
<option>zapatillaz</option>
<option>botas</option>
</select>
<selectname="animal"size="3"multiple>
<optionselected>---accesorios---</option>
<option value="ave">muñequeras</option>
<option>gorros</option>
<option>gafas</option>
<option>maletines</option>
</select>
<hr aling="center"width="50"color="red"noshade>
<pre>
airjordan2015
colegionacional nicolasesguerra
calle 7 N° 87- 59 bogotacolombia
TIC/EDWARDNEUTA905.BLOGSPOT.COM
</body>
</html>
<hr>

Más contenido relacionado

La actualidad más candente

Treabajofinal 140828102436-phpapp02
Treabajofinal 140828102436-phpapp02Treabajofinal 140828102436-phpapp02
Treabajofinal 140828102436-phpapp02miguelbeja123
 
MICROSOFT OFFICE ACCESS
MICROSOFT OFFICE ACCESSMICROSOFT OFFICE ACCESS
MICROSOFT OFFICE ACCESSmilenka796
 
Practica (formularios)
Practica (formularios)Practica (formularios)
Practica (formularios)guascasar
 
Formularios universidad fasta[1]
Formularios universidad fasta[1]Formularios universidad fasta[1]
Formularios universidad fasta[1]Sasuke Rayciz
 
Microsoft Access 2007
Microsoft Access 2007Microsoft Access 2007
Microsoft Access 2007Rolf Pinto
 
Bases de datos
Bases de datos Bases de datos
Bases de datos 7826501
 
Paso a paso para crear un formulario en dreamweaver.
Paso a paso para crear un formulario en dreamweaver.Paso a paso para crear un formulario en dreamweaver.
Paso a paso para crear un formulario en dreamweaver.marybermudez12
 
Lab 1. entorno de access
Lab 1. entorno de accessLab 1. entorno de access
Lab 1. entorno de accessgoogle
 
Como hacer un formulario en dreamweaver
Como hacer un formulario en dreamweaverComo hacer un formulario en dreamweaver
Como hacer un formulario en dreamweaverStefannyCantillo
 
10 formulario
10 formulario10 formulario
10 formularioMarianmv
 

La actualidad más candente (16)

Treabajofinal 140828102436-phpapp02
Treabajofinal 140828102436-phpapp02Treabajofinal 140828102436-phpapp02
Treabajofinal 140828102436-phpapp02
 
MICROSOFT OFFICE ACCESS
MICROSOFT OFFICE ACCESSMICROSOFT OFFICE ACCESS
MICROSOFT OFFICE ACCESS
 
2 utn frba manual access 2010 tablas
2  utn frba manual access 2010   tablas2  utn frba manual access 2010   tablas
2 utn frba manual access 2010 tablas
 
Aleja reyes
Aleja reyesAleja reyes
Aleja reyes
 
Bd
BdBd
Bd
 
Steven andres ;d
Steven andres ;dSteven andres ;d
Steven andres ;d
 
Practica (formularios)
Practica (formularios)Practica (formularios)
Practica (formularios)
 
Formularios universidad fasta[1]
Formularios universidad fasta[1]Formularios universidad fasta[1]
Formularios universidad fasta[1]
 
Practica N 2
Practica N 2Practica N 2
Practica N 2
 
Microsoft Access 2007
Microsoft Access 2007Microsoft Access 2007
Microsoft Access 2007
 
Bases de datos
Bases de datos Bases de datos
Bases de datos
 
Paso a paso para crear un formulario en dreamweaver.
Paso a paso para crear un formulario en dreamweaver.Paso a paso para crear un formulario en dreamweaver.
Paso a paso para crear un formulario en dreamweaver.
 
Lab 1. entorno de access
Lab 1. entorno de accessLab 1. entorno de access
Lab 1. entorno de access
 
Como hacer un formulario en dreamweaver
Como hacer un formulario en dreamweaverComo hacer un formulario en dreamweaver
Como hacer un formulario en dreamweaver
 
10 formulario
10 formulario10 formulario
10 formulario
 
Guia access
Guia accessGuia access
Guia access
 

Destacado

chỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcm
chỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcmchỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcm
chỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcmmarkus779
 
Halloween
HalloweenHalloween
Halloweenrgassio
 
chỗ nào dịch vụ giúp việc theo tháng cao cấp hcm
chỗ nào dịch vụ giúp việc theo tháng cao cấp hcmchỗ nào dịch vụ giúp việc theo tháng cao cấp hcm
chỗ nào dịch vụ giúp việc theo tháng cao cấp hcmbecki407
 
RESUME PRINT This one!
RESUME PRINT This one!RESUME PRINT This one!
RESUME PRINT This one!Shannon Ward
 
chỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcm
chỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcmchỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcm
chỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcmjim538
 
Bases fisiologicas de la terapia manual y osteopatia marcel bienfait
Bases fisiologicas de la terapia manual y osteopatia   marcel bienfaitBases fisiologicas de la terapia manual y osteopatia   marcel bienfait
Bases fisiologicas de la terapia manual y osteopatia marcel bienfaitAdlem Dutra
 
"Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช...
"Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช..."Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช...
"Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช...Wiraya Srisimarat
 

Destacado (9)

chỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcm
chỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcmchỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcm
chỗ nào dịch vụ giúp việc theo giờ đảm bảo tphcm
 
Halloween
HalloweenHalloween
Halloween
 
Componentes de un proyecto
Componentes de un proyectoComponentes de un proyecto
Componentes de un proyecto
 
chỗ nào dịch vụ giúp việc theo tháng cao cấp hcm
chỗ nào dịch vụ giúp việc theo tháng cao cấp hcmchỗ nào dịch vụ giúp việc theo tháng cao cấp hcm
chỗ nào dịch vụ giúp việc theo tháng cao cấp hcm
 
Class 16 vocab game
Class 16 vocab gameClass 16 vocab game
Class 16 vocab game
 
RESUME PRINT This one!
RESUME PRINT This one!RESUME PRINT This one!
RESUME PRINT This one!
 
chỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcm
chỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcmchỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcm
chỗ nào dịch vụ giúp việc theo tháng bảo đảm tại hcm
 
Bases fisiologicas de la terapia manual y osteopatia marcel bienfait
Bases fisiologicas de la terapia manual y osteopatia   marcel bienfaitBases fisiologicas de la terapia manual y osteopatia   marcel bienfait
Bases fisiologicas de la terapia manual y osteopatia marcel bienfait
 
"Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช...
"Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช..."Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช...
"Talent Mobility ก้าวสำคัญเพื่อเพิ่มขีดความสามารถด้าน วทน. ของประเทศ" ดร.พิเช...
 

Similar a Formularios 1 (20)

Formularios
FormulariosFormularios
Formularios
 
Mapa conceptual info
Mapa conceptual infoMapa conceptual info
Mapa conceptual info
 
Formularios y Validaciones
Formularios y ValidacionesFormularios y Validaciones
Formularios y Validaciones
 
Semana 2 Etiquetas semánticas y HTML 5
Semana 2   Etiquetas semánticas y HTML 5Semana 2   Etiquetas semánticas y HTML 5
Semana 2 Etiquetas semánticas y HTML 5
 
Formularios en html
Formularios en htmlFormularios en html
Formularios en html
 
Frames y formularios en html
Frames y formularios en htmlFrames y formularios en html
Frames y formularios en html
 
INTRODUCCIÓN A HTML – XHTML – Clase 03
INTRODUCCIÓN A HTML – XHTML – Clase 03INTRODUCCIÓN A HTML – XHTML – Clase 03
INTRODUCCIÓN A HTML – XHTML – Clase 03
 
Curso HTML 5 & jQuery - Leccion 4
Curso HTML 5 & jQuery - Leccion 4Curso HTML 5 & jQuery - Leccion 4
Curso HTML 5 & jQuery - Leccion 4
 
Formularios html
Formularios htmlFormularios html
Formularios html
 
Html 5: formularios
Html 5: formulariosHtml 5: formularios
Html 5: formularios
 
Doc1
Doc1Doc1
Doc1
 
Guía Formulario
Guía FormularioGuía Formulario
Guía Formulario
 
Formulario
FormularioFormulario
Formulario
 
Clase 1 Plataforma introducción a Diseño Web
Clase 1 Plataforma introducción a Diseño WebClase 1 Plataforma introducción a Diseño Web
Clase 1 Plataforma introducción a Diseño Web
 
Formularios
FormulariosFormularios
Formularios
 
ETIQUETAS FORMULARIOS HTML.pptx
ETIQUETAS FORMULARIOS HTML.pptxETIQUETAS FORMULARIOS HTML.pptx
ETIQUETAS FORMULARIOS HTML.pptx
 
ETIQUETAS FORMULARIOS HTML.pptx
ETIQUETAS FORMULARIOS HTML.pptxETIQUETAS FORMULARIOS HTML.pptx
ETIQUETAS FORMULARIOS HTML.pptx
 
Formularios html5
Formularios html5Formularios html5
Formularios html5
 
Trabajo2015
Trabajo2015Trabajo2015
Trabajo2015
 
ETIQUETAS FORM HTML.pptx nuevo
ETIQUETAS FORM HTML.pptx nuevoETIQUETAS FORM HTML.pptx nuevo
ETIQUETAS FORM HTML.pptx nuevo
 

Más de Daniel Esteban

Más de Daniel Esteban (17)

COLEGIO NICOLAS ESGUERRA
COLEGIO NICOLAS ESGUERRACOLEGIO NICOLAS ESGUERRA
COLEGIO NICOLAS ESGUERRA
 
Word 2010
Word 2010Word 2010
Word 2010
 
Colegio 7
Colegio 7Colegio 7
Colegio 7
 
Colegio 6
Colegio 6Colegio 6
Colegio 6
 
Colegio 5
Colegio 5Colegio 5
Colegio 5
 
Colegio 4
Colegio 4Colegio 4
Colegio 4
 
Colegio 3
Colegio 3Colegio 3
Colegio 3
 
Colegio 2
Colegio 2Colegio 2
Colegio 2
 
Colegio 1
Colegio 1Colegio 1
Colegio 1
 
Colegio nacional nicolas esguerra 0
Colegio nacional nicolas esguerra 0Colegio nacional nicolas esguerra 0
Colegio nacional nicolas esguerra 0
 
Colegio nacional nicolás esguerra 5
Colegio nacional nicolás esguerra 5Colegio nacional nicolás esguerra 5
Colegio nacional nicolás esguerra 5
 
Colegio nacional nicolás esguerra 1
Colegio nacional nicolás esguerra 1Colegio nacional nicolás esguerra 1
Colegio nacional nicolás esguerra 1
 
Colegio nacional nicolás esguerra
Colegio nacional nicolás esguerraColegio nacional nicolás esguerra
Colegio nacional nicolás esguerra
 
Colegio nacional nicolás esguerra 4
Colegio nacional nicolás esguerra 4Colegio nacional nicolás esguerra 4
Colegio nacional nicolás esguerra 4
 
Colegio nacional nicolás esguerra 2
Colegio nacional nicolás esguerra 2Colegio nacional nicolás esguerra 2
Colegio nacional nicolás esguerra 2
 
Colegio nacional nicolás esguerra 6
Colegio nacional nicolás esguerra 6Colegio nacional nicolás esguerra 6
Colegio nacional nicolás esguerra 6
 
Unidad 3
Unidad 3Unidad 3
Unidad 3
 

Formularios 1

  • 1. Colegio nacional Nicolás esguerra Daniel pachón ángel Edward neuta Arévalo Página web IX FORMULARIOS Formulario <form> Un formulario es un elemento que permite recoger datos introducidos por el usuario. Los formularios se utilizan para conocer las opiniones, dudas, y otra serie de datos sobre los usuarios, para introducir pedidos a través de la red, tienen multitud de aplicaciones. Un formulario está formado, entre otras cosas, por etiquetas, campos de texto, menús desplegables, y botones. Es muy recomendable utilizar tablas para organizar los elementos de los formularios. Utilizando tablas se consigue una mejor distribución de los elementos del formulario, lo que facilita su comprensión y mejora su apariencia. Los formularios se insertan a través de las etiquetas <form> y </form>. Entre dichas etiquetas habrá que insertar los diferentes objetos que formarán el formulario. la etiqueta <form> tiene los siguientes atributos: El atributo action indica una dirección de correo electrónico a la que mandar el formulario, o la dirección del programa que se encargará de procesar el contenido del formulario. El atributo enctype indica el modo en que será cifrada la información para su envío. Por defecto tiene el valor application/x-www-form-urlencoded. El atributo method indica el metodo mediante el que se transferirán las variables del formulario. Su valor puede ser get o post.
  • 2. El valor get se utiliza cuando no se van a producir cambios en ningún documento o programa que no sea el navegador del usuario que pretende mandar el formulario, como ocurre cuando se realizan consultas sobre una base de datos. El valor post se utiliza cuando sí se van a producir cambios, como ocurre cuando el usuario manda datos que deben ser almacenados en una base de datos. Se recomienda utilizar el valor post. Por ejemplo, podríamos insertar un formulario escribiendo el siguiente código: <form action="mailto:formularios@aulaclic.com" method="post" enctype="text/plain" > ... </form> A continuación veamos los distintos elementos que se pueden incluir en un formulario. Áreas de texto <textarea> Las áreas de texto permiten a los usuarios insertar varias líneas de texto. Por ello, suelen utilizarse para que incluyan comentarios. Para insertar un área de texto es necesario incluir las etiquetas <textarea> y </textarea> entre las etiquetas <form> y </form> del formulario. Para que el área de texto tenga algún valor inicial, habrá que insertarlo entre las etiquetas <textarea> y </textarea>. El atributo name indica el nombre del área de texto. Es necesario dar nombres diferentes a cada uno de los elementos de un formulario, para poder identificarlos a la hora de procesarlos. El atributo rows indica el número de líneas que podrán ser visualizadas en el área de texto por lo que determina al alto del área de texto. El atributo cols indica el número de caracteres por línea que podrán ser visualizados en el área de texto por lo que determina al ancho del área de texto. Gracias a las barras de desplazamiento, es posible insertar más líneas de las especificadas en el atributo rows, y más caracteres por línea de los especificados en el atributo cols. Por ejemplo, para insertar el área de texto: Escribe el texto que quieras Habría que escribir: <textarea name="ejemploarea" cols="30" rows="3">Escribe el texto que quieras</textarea>
  • 3. RESULTADO: CODIGO: <html> <head> </title>airjordan905</title> </head> <!--estapaginawebeselaboradapordaniel pachonangel yedwardneuta905//--> <bodybgcolor="green"> <hr> <marquee bgcolor="yellow"behavior="alternatedirection="right"><h3>BIENVENIDOSA NUESTRA EMPRESA AIRJORDAN </MARQUEE><br> <hr> nuestraempresabrindaserviciosde calidad<br> <br> <inputname="tunombre"type="text"value="tue-mail"size="20"maxlength="15"> <inputname="tue-mail"type="password"value="contraseña"size="20"maxlength="15"> <inputname="ciclo"type="submit"value="Enviar"> <inputname="casilla"type="checkbox"value="acepto"checked> <inputname="prefiere"type="radio"value="estudiar"checked> <inputname="prefiere"type="radio"value="trabajar"> <inputname="prefiere"type="radio"value="estudiar"checked> <inputname="prefiere"type="radio"value="trabajar"> <selectname="calzado"> <optionselected>---calzado---</option> <option>zapatillaz</option> <option>botas</option> </select> <selectname="animal"size="3"multiple> <optionselected>---accesorios---</option> <option value="ave">muñequeras</option> <option>gorros</option> <option>gafas</option> <option>maletines</option> </select>
  • 4. <hr aling="center"width="50"color="red"noshade> <pre> airjordan2015 colegionacional nicolasesguerra calle 7 N° 87- 59 bogotacolombia TIC/EDWARDNEUTA905.BLOGSPOT.COM </body> </html> <hr>