90 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
			
		
		
	
	
			90 lines
		
	
	
		
			1.7 KiB
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| ---
 | |
| id: bad87fee1348bd9aedf08829
 | |
| title: Crea un campo de texto
 | |
| challengeType: 0
 | |
| videoUrl: 'https://scrimba.com/p/pVMPUv/c2EVnf6'
 | |
| forumTopicId: 16823
 | |
| dashedName: create-a-text-field
 | |
| ---
 | |
| 
 | |
| # --description--
 | |
| 
 | |
| Ahora crearemos un formulario web.
 | |
| 
 | |
| Los elementos de entrada `input` son una forma conveniente de obtener información de tu usuario.
 | |
| 
 | |
| Puedes crear una entrada de texto de esta manera:
 | |
| 
 | |
| ```html
 | |
| <input type="text">
 | |
| ```
 | |
| 
 | |
| Ten en cuenta que los elementos `input` se cierran automáticamente.
 | |
| 
 | |
| # --instructions--
 | |
| 
 | |
| Crea un elemento `input` de tipo `text` debajo de tus listas.
 | |
| 
 | |
| # --hints--
 | |
| 
 | |
| Tu aplicación debe tener un elemento `input` de tipo `text`.
 | |
| 
 | |
| ```js
 | |
| assert($('input[type=text]').length > 0);
 | |
| ```
 | |
| 
 | |
| # --seed--
 | |
| 
 | |
| ## --seed-contents--
 | |
| 
 | |
| ```html
 | |
| <h2>CatPhotoApp</h2>
 | |
| <main>
 | |
|   <p>Click here to view more <a href="#">cat photos</a>.</p>
 | |
| 
 | |
|   <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
 | |
| 
 | |
|   <p>Things cats love:</p>
 | |
|   <ul>
 | |
|     <li>cat nip</li>
 | |
|     <li>laser pointers</li>
 | |
|     <li>lasagna</li>
 | |
|   </ul>
 | |
|   <p>Top 3 things cats hate:</p>
 | |
|   <ol>
 | |
|     <li>flea treatment</li>
 | |
|     <li>thunder</li>
 | |
|     <li>other cats</li>
 | |
|   </ol>
 | |
| 
 | |
| 
 | |
| </main>
 | |
| ```
 | |
| 
 | |
| # --solutions--
 | |
| 
 | |
| ```html
 | |
| <h2>CatPhotoApp</h2>
 | |
| <main>
 | |
|   <p>Click here to view more <a href="#">cat photos</a>.</p>
 | |
| 
 | |
|   <a href="#"><img src="https://www.bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>
 | |
| 
 | |
|   <p>Things cats love:</p>
 | |
|   <ul>
 | |
|     <li>cat nip</li>
 | |
|     <li>laser pointers</li>
 | |
|     <li>lasagna</li>
 | |
|   </ul>
 | |
|   <p>Top 3 things cats hate:</p>
 | |
|   <ol>
 | |
|     <li>flea treatment</li>
 | |
|     <li>thunder</li>
 | |
|     <li>other cats</li>
 | |
|   </ol>
 | |
|   <form>
 | |
|     <input type="text">
 | |
|   </form>
 | |
| </main>
 | |
| ```
 |