viernes, 9 de septiembre de 2016
actividad 4.14
<html>
<head>
<title>Formulario de prueba de HTML5
</title>
</head>
<body>
<h1>Formulario de prueba de HTML5
</h1>
<form action="" method="get">
<p>
Nombre: <input type="text" name="nom" required autofocus />
</p>
<p>
Correo electrónico: <input type="email" name="cor_ele" required />
</p>
<p>
URL: <input type="url" name="url" placeholder="Escribe la URL de tu página web personal" />
</p>
<p>
Fecha: <input type="date" name="fec" />
</p>
<p>
Tiempo: <input type="time" name="tie" />
</p>
<p>
Fecha y hora: <input type="datetime" name="fyh" />
</p>
<p>
Mes: <input type="month" name="mes" />
</p>
<p>
Semana: <input type="week" name="wee" />
</p>
<p>
Número: <input type="number" name="num" min="-10" max="10" value="0" /> (entre -10 y 10)
</p>
<p>
Teléfono: <input type="tel" name="tel" />
</p>
<p>
Término de búsqueda: <input type="search" name="bus" />
</p>
<p>
Color favorito: <input type="color" name="col" />
</p>
<p>
<input type="submit" value="Enviar" />
</p>
</form>
</body>
</html>
<!--
1. Crea una página web que contenga un formulario con los siguientes campos de información:
Nombre, con un control de tipo texto obligatorio y con autofoco.
Correo electrónico, con un control de tipo email obligatorio.
URL, con un control de tipo url que muestre la ayuda "Escribe la URL de tu página web personal".
Fecha, con un control de tipo date.
Tiempo, con un control de tipo time.
Fecha y hora, con un control de tipo datetime.
Mes, con un control de tipo month.
Semana, con un control de tipo week.
Número, con un control de tipo number que limite la entrada a un valor entre -10 y 10.
Teléfono, con un control de tipo tel.
Término de búsqueda, con un control de tipo search.
Color favorito, con un control de tipo color.
Un botón de envío.
Además, tienes que tener en cuenta los siguientes requisitos:
El título de la página debe ser Formulario de prueba de HTML5.
El método de envío del formulario debe ser GET.
El destino del envío del formulario debe ser "".
Nota 1: si al validar el código HTML de tu página web con el validador del W3C se muestran mensajes de advertencia como "The date input type is not supported in all browsers. Please be sure to test, and consider using a polyfill.", no te preocupes. El validador te está avisando de que tengas cuidado al usar una característica de HTML5 que no está admitida por todos los navegadores actuales.
Nota 2: debido a lo explicado en la nota anterior, cuando realices esta actividad y compruebes cómo se visualiza tu página web en distintos navegadores es muy probable que obtengas diferentes resultados.
-->
<head>
<title>Formulario de prueba de HTML5
</title>
</head>
<body>
<h1>Formulario de prueba de HTML5
</h1>
<form action="" method="get">
<p>
Nombre: <input type="text" name="nom" required autofocus />
</p>
<p>
Correo electrónico: <input type="email" name="cor_ele" required />
</p>
<p>
URL: <input type="url" name="url" placeholder="Escribe la URL de tu página web personal" />
</p>
<p>
Fecha: <input type="date" name="fec" />
</p>
<p>
Tiempo: <input type="time" name="tie" />
</p>
<p>
Fecha y hora: <input type="datetime" name="fyh" />
</p>
<p>
Mes: <input type="month" name="mes" />
</p>
<p>
Semana: <input type="week" name="wee" />
</p>
<p>
Número: <input type="number" name="num" min="-10" max="10" value="0" /> (entre -10 y 10)
</p>
<p>
Teléfono: <input type="tel" name="tel" />
</p>
<p>
Término de búsqueda: <input type="search" name="bus" />
</p>
<p>
Color favorito: <input type="color" name="col" />
</p>
<p>
<input type="submit" value="Enviar" />
</p>
</form>
</body>
</html>
<!--
1. Crea una página web que contenga un formulario con los siguientes campos de información:
Nombre, con un control de tipo texto obligatorio y con autofoco.
Correo electrónico, con un control de tipo email obligatorio.
URL, con un control de tipo url que muestre la ayuda "Escribe la URL de tu página web personal".
Fecha, con un control de tipo date.
Tiempo, con un control de tipo time.
Fecha y hora, con un control de tipo datetime.
Mes, con un control de tipo month.
Semana, con un control de tipo week.
Número, con un control de tipo number que limite la entrada a un valor entre -10 y 10.
Teléfono, con un control de tipo tel.
Término de búsqueda, con un control de tipo search.
Color favorito, con un control de tipo color.
Un botón de envío.
Además, tienes que tener en cuenta los siguientes requisitos:
El título de la página debe ser Formulario de prueba de HTML5.
El método de envío del formulario debe ser GET.
El destino del envío del formulario debe ser "".
Nota 1: si al validar el código HTML de tu página web con el validador del W3C se muestran mensajes de advertencia como "The date input type is not supported in all browsers. Please be sure to test, and consider using a polyfill.", no te preocupes. El validador te está avisando de que tengas cuidado al usar una característica de HTML5 que no está admitida por todos los navegadores actuales.
Nota 2: debido a lo explicado en la nota anterior, cuando realices esta actividad y compruebes cómo se visualiza tu página web en distintos navegadores es muy probable que obtengas diferentes resultados.
-->
jueves, 1 de septiembre de 2016
miércoles, 31 de agosto de 2016
jueves, 25 de agosto de 2016
actividad 4.5
<html>
<head>
<title>Desempleo
</title>
<style>
table, tr, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<h1>
El desempleo en España
</h1>
<p>
La siguiente tabla muestra la evolución del desempleo en España, comparado con la media de los 27 países de la Unión Europea, Grecia, que compite con España en ser el primero en esta vergonzosa competición y Estados Unidos y Japón, dos de las primeras economías mundiales.
</p>
<table>
<tr>
<th>País</th>
<th>2000</th>
<th>2001</th>
<th>2002</th>
<th>2003</th>
<th>2004</th>
<th>2005</th>
<th>2006</th>
<th>2007</th>
<th>2008</th>
<th>2009</th>
<th>2010</th>
<th>2011</th>
<th>2012</th>
<th>2013</th>
</tr>
<tr>
<td>UE (27 países)</td>
<td>8.9</td>
<td>8.7</td>
<td>9</td>
<td>9.1</td>
<td>9.3</td>
<td>9</td>
<td>8.2</td>
<td>7.2</td>
<td>7</td>
<td>9</td>
<td>9.6</td>
<td>9.6</td>
<td>10.4</td>
<td>10.8</td>
</tr>
<tr>
<td><strong>España</strong></td>
<td><strong>11.9</strong></td>
<td><strong>10.6</strong></td>
<td><strong>11.5</strong></td>
<td><strong>11.5</strong></td>
<td><strong>11</strong></td>
<td><strong>9.2</strong></td>
<td><strong>8.5</strong></td>
<td><strong>8.2</strong></td>
<td><strong>11.3</strong></td>
<td><strong>17.9</strong></td>
<td><strong>19.9</strong></td>
<td><strong>21.4</strong></td>
<td><strong>24.8</strong></td>
<td><strong>26.1</strong></td>
</tr>
<tr>
<td>Grecia</td>
<td>11.2</td>
<td>10.7</td>
<td>10.3</td>
<td>9.7</td>
<td>10.6</td>
<td>10</td>
<td>9</td>
<td>8.4</td>
<td>7.8</td>
<td>9.6</td>
<td>12.7</td>
<td>17.9</td>
<td>24.5</td>
<td>27.5</td>
</tr>
<tr>
<td>Estados Unidos</td>
<td>4</td>
<td>4.8</td>
<td>5.8</td>
<td>6</td>
<td>5.5</td>
<td>5.1</td>
<td>4.6</td>
<td>4.6</td>
<td>5.8</td>
<td>9.3</td>
<td>9.6</td>
<td>8.9</td>
<td>8.1</td>
<td>7.4</td>
</tr>
<tr>
<td>Japón</td>
<td>4.7</td>
<td>5</td>
<td>5.4</td>
<td>5.3</td>
<td>4.7</td>
<td>4.4</td>
<td>4.1</td>
<td>3.9</td>
<td>4</td>
<td>5.1</td>
<td>5.1</td>
<td>4.6</td>
<td>4.3</td>
<td>4</td>
</tr>
</table>
<p>
Fuente: <a href="http://epp.eurostat.ec.europa.eu/tgm/table.do?tab=table&init=1&language=en&pcode=tsdec450&plugin=1
">Índice de desempleo anual</a>, Eurostat
</p>
</body>
</html>
<!--
1. Crea una página web a partir del texto que se te proporciona y que tenga el mismo aspecto que en la siguiente imagen:
Captura de pantalla
Para crear la página web tienes que tener en cuenta los siguientes requisitos:
El destino del enlace "Índice de desempleo anual" es la página web:
http://epp.eurostat.ec.europa.eu/tgm/table.do?tab=table&init=1&language=en&pcode=tsdec450&plugin=1
Nota: en el código base que se te proporciona vas a encontrar una etiqueta nueva, la etiqueta <style>. Esta etiqueta permite introducir instrucciones de CSS (Cascading Style Sheets) en una página web.
CSS se emplea para definir la presentación visual de una página web y se explica en la segunda parte de este curso. Las instrucciones que se han incluido tienen como objetivo que la tabla y las celdas de la tabla se muestren con un borde. Esto también se podría haber logrado con el atributo border de HTML, pero es mejor utilizar siempre CSS para todo lo relacionado con la presentación de una página web. El uso del CSS se explica en la segunda parte de este curso.
-->
<head>
<title>Desempleo
</title>
<style>
table, tr, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<h1>
El desempleo en España
</h1>
<p>
La siguiente tabla muestra la evolución del desempleo en España, comparado con la media de los 27 países de la Unión Europea, Grecia, que compite con España en ser el primero en esta vergonzosa competición y Estados Unidos y Japón, dos de las primeras economías mundiales.
</p>
<table>
<tr>
<th>País</th>
<th>2000</th>
<th>2001</th>
<th>2002</th>
<th>2003</th>
<th>2004</th>
<th>2005</th>
<th>2006</th>
<th>2007</th>
<th>2008</th>
<th>2009</th>
<th>2010</th>
<th>2011</th>
<th>2012</th>
<th>2013</th>
</tr>
<tr>
<td>UE (27 países)</td>
<td>8.9</td>
<td>8.7</td>
<td>9</td>
<td>9.1</td>
<td>9.3</td>
<td>9</td>
<td>8.2</td>
<td>7.2</td>
<td>7</td>
<td>9</td>
<td>9.6</td>
<td>9.6</td>
<td>10.4</td>
<td>10.8</td>
</tr>
<tr>
<td><strong>España</strong></td>
<td><strong>11.9</strong></td>
<td><strong>10.6</strong></td>
<td><strong>11.5</strong></td>
<td><strong>11.5</strong></td>
<td><strong>11</strong></td>
<td><strong>9.2</strong></td>
<td><strong>8.5</strong></td>
<td><strong>8.2</strong></td>
<td><strong>11.3</strong></td>
<td><strong>17.9</strong></td>
<td><strong>19.9</strong></td>
<td><strong>21.4</strong></td>
<td><strong>24.8</strong></td>
<td><strong>26.1</strong></td>
</tr>
<tr>
<td>Grecia</td>
<td>11.2</td>
<td>10.7</td>
<td>10.3</td>
<td>9.7</td>
<td>10.6</td>
<td>10</td>
<td>9</td>
<td>8.4</td>
<td>7.8</td>
<td>9.6</td>
<td>12.7</td>
<td>17.9</td>
<td>24.5</td>
<td>27.5</td>
</tr>
<tr>
<td>Estados Unidos</td>
<td>4</td>
<td>4.8</td>
<td>5.8</td>
<td>6</td>
<td>5.5</td>
<td>5.1</td>
<td>4.6</td>
<td>4.6</td>
<td>5.8</td>
<td>9.3</td>
<td>9.6</td>
<td>8.9</td>
<td>8.1</td>
<td>7.4</td>
</tr>
<tr>
<td>Japón</td>
<td>4.7</td>
<td>5</td>
<td>5.4</td>
<td>5.3</td>
<td>4.7</td>
<td>4.4</td>
<td>4.1</td>
<td>3.9</td>
<td>4</td>
<td>5.1</td>
<td>5.1</td>
<td>4.6</td>
<td>4.3</td>
<td>4</td>
</tr>
</table>
<p>
Fuente: <a href="http://epp.eurostat.ec.europa.eu/tgm/table.do?tab=table&init=1&language=en&pcode=tsdec450&plugin=1
">Índice de desempleo anual</a>, Eurostat
</p>
</body>
</html>
<!--
1. Crea una página web a partir del texto que se te proporciona y que tenga el mismo aspecto que en la siguiente imagen:
Captura de pantalla
Para crear la página web tienes que tener en cuenta los siguientes requisitos:
El destino del enlace "Índice de desempleo anual" es la página web:
http://epp.eurostat.ec.europa.eu/tgm/table.do?tab=table&init=1&language=en&pcode=tsdec450&plugin=1
Nota: en el código base que se te proporciona vas a encontrar una etiqueta nueva, la etiqueta <style>. Esta etiqueta permite introducir instrucciones de CSS (Cascading Style Sheets) en una página web.
CSS se emplea para definir la presentación visual de una página web y se explica en la segunda parte de este curso. Las instrucciones que se han incluido tienen como objetivo que la tabla y las celdas de la tabla se muestren con un borde. Esto también se podría haber logrado con el atributo border de HTML, pero es mejor utilizar siempre CSS para todo lo relacionado con la presentación de una página web. El uso del CSS se explica en la segunda parte de este curso.
-->
martes, 16 de agosto de 2016
Suscribirse a:
Entradas (Atom)