martes, 20 de septiembre de 2016

[ SEPTIEMBRE 20 2016]

INICIO CUARTO PERIODO








   JAVASCRIPT

JAVASCRIPT EN DOCUMENTOS HTML
Se ofrece aquí un primer ejemplo en el que se ilustra la integración directa de código JavaScript en un documento HTML:

<html>
<head>
<title>Primer ejemplo de JavaScript</title>
</head>
<body>
Esto es texto normal de un documento HTML
<SCRIPT LANGUAGE="JavaScript"> document.write("Texto generado desde JavaScript")
</script>
Esto es, de nuevo, HTML
</body>
</html>

Como se puede observar, este ejemplo tiene la apariencia de un documento HTML estándar. La única novedad viene dada por la presencia del fragmento correspondiente al código JavaScript:

<script language="JavaScript"> document.write('Texto generado desde Javascript")
</script>

Para poder ver el resultado de su ejecución, bastará con cargar dicho documento con cualquiera de los clientes Web antes mencionados.

La salida, como se aprecia en las figuras adjuntas (para ambos clientes Web), se compone de tres líneas de texto:
- Esto es texto normal de un documento HTML
- Texto generado desde JavaScript
- De nuevo HTML

En realidad no se trata de un script útil, puesto que todo lo que ofrece (mostrar una línea de texto) se podría haber hecho en HTML directamente y, sin duda, con mayor comodidad. Sólo se trata de mostrar el funcionamiento del código <SCRIPT>.

En efecto, cualquier elemento que quede delimitado por los códigos <SCRIPT> y </SCRIPT> se considera código JavaScript .

En este caso particular, se ha utilizado document.write , una de las funciones más importantes de JavaScript, que permite escribir algo en el documento actual (en este caso, el documento HTML que contiene el ejemplo).

http://www.webtaller.com/manual-javascript/javascript-documentos-html.php

[ AGOSTO 30 2016 ]

Acumulativo


Se realizó el acumulativo de tercer período.

Ejercicio en el que tocaba

1.) Hacer una página con un color de fondo, una tabla de 4*2 en la primera columna colocabamos en cada celda el nombre y apellido de los integrantes y en la segunda columna se debía colocar en una celda proyecto a y en la otra celda proyecto b, cuando se le diera click se abriría en otra pestaña el proyecto señalado.

2.)crear una carpeta y nombrarla con los códigos de menor a mayor de los integrantes así : 05_23_

3.) Un documento html dentro de la carpeta






sábado, 27 de agosto de 2016

[ AGOSTO 23 2016]

ALGUNOS EJERCICIOS:

1.para anclas

<html>
<head><title>ANCLAS</title>
<body><h3>ESTO ES ANCLAS<h3>

  <a name="ARRIBA"> </a> <br>
  <a href="#uno">uno</a> <br>
 <a href="#dos">dos</a> <br>
 <a href="#tres">tres </a> <br>
<a href="#cuatro">cuatro</a>


<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>

uno <a name="uno"></a><a href="#ARRIBA"> [regresar]</a>

<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>


dos <a name="dos"> </a>dos<a href="#ARRIBA"> [regresar] </a>

<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>


tres <a name="tres"> </a> tres <a href="ARRIBA"> [regresar] </a>

<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>


cuatro <a name="cuatro"> </a> <a href="ARRIBA"> [hola baby] </a>

<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>
<br> <br> <br> <br> <br> <br> <br> <br> <br>


</body>
</html>


2.para formularios
<html>
<head><title>FORMULARIOS</title></head>
<body>
<p align=left><font size=6>Cuestionario de Personal</font></p> <FORM ACTION="MAILTO:carmenortegaper@terra.es" METHOD=POST ENCTYPE="text/plain"> 


<b>Nombre</b><br>
<INPUT TYPE=TEXT NAME=NOMBRE size=50><BR><br>


<b>Sexo:</b><br>


<INPUT TYPE=RADIO NAME=SEXO VALUE=MASCULINO>Masculino<br>
<INPUT TYPE=RADIO NAME=SEXO VALUE=FEMENINO>Femenino<br><br>

<b>Número de miembros de la familia</b><br>
<INPUT TYPE=TEXT NAME=numero de miembros de la familia size=5><BR><br>
<b>Idiomas que conoce:</b><br>
<INPUT TYPE=checkbox NAME=idiomas VALUE=frances>Francés<br>
<INPUT TYPE=checkbox NAME=idiomas VALUE=ingles>Inglés<br><br>
<b>Otros:</b><br>
<textarea NAME=Otros ROWS=5 COLS=50></TEXTAREA><br><br>
<INPUT TYPE=SUBMIT VALUE="ENVIAR DATOS">
<INPUT TYPE=RESET VALUE="VOLVER A COMENZAR"><br><br>
</body>
</html>

3. para tablas

<html>
<head>
<title>tablas</title>
</head>
<body>
<table border= 2 cellspacing= 1 cellpalding= 1 width= 70% height= 80% align=center Bgcolor= WHITE bordercolor= green>
<TR>
<TD BGCOLOR= MAGENTA> CELDA 1,1 </TD>
<TD BGCOLOR= YELLOW> CELDA 1,2 </TD>
</TR>
<TR>
<TD ALIGN=CENTER><IMG SRC=ESCUDOCL.GIF> </TD>
<TD BGCOLOR= BROWN><FONT COLOR= WHITE>Se detallan a continuación una selección de rutas o excursiones para realizar a pie, en bici o a caballo, de dificultad intermedia y que pueden realizarse por cualquier aficionado al senderismo y al contacto con la naturaleza. Se trata de una selección de resúmenes de rutas por toda la comarca que están siendo elaboradas por el Colectivo de Ecología Ibérica y que ya han visto la luz en forma de Libro-Guía.</FONT>
</TD>
</TR>
</TABLE>
</body>
</html>



domingo, 21 de agosto de 2016

[AGOSTO 16 2016]

Alineaciones dentro de las celdas.
Veamos como se pueden alinear los objetos dentro de las celdas de una tabla:


En la primera celda el texto está alineado a la izquierda. No hay que hacer nada, es la alineación que se establece por defecto. (Podría escribirse, de todas formas: <td align="left">).
Primera fila (alineación horizontal):
  • En la segunda celda el texto está alineado en el centro: <td align="center">.
  • En la tercera celda el texto está alineado a la derecha: <td align="right">.
Segunda fila (alineación vertical):
  • En la primera celda el texto está alineado en la parte superior: <td valign="top">.
  • En la segunda celda el texto está alineado en la parte central. No hay que hacer nada, es la alineación vertical establecida por defecto. (Podría escribirse, de todas formas: <td valign="middle">) .
  • En la tercera celda el texto está alineado en la parte inferior: <td valign="bottom">.
Para observar mejor los resultados se ha forzado la altura de las celdas a 50 píxeles. Basta escribirlo en la primera celda de cada fila: <td height="50"> pero podría escribirse en todas ellas.



SONIDO A UNA PÁGINA WEB 

Para escuchar música desde una página web es utilizar el elemento <audio>.
Hay que tener en cuenta que sólo funcionan con los browsers Internet Explorer 9+, Chile, Safari, Firefox y ópera.

<audio controls="">
Indica que el browser debe mostrar la barra de control para escuchar el tema musical 

<Source src="tema musical.mp3"
Type="audio/mpeg">
Indica la fuente de donde se tomará el audio correspondiente. El atributo "type" indica que formato de audio.

Nota:
La música en formato mp3 suele ser más pesada que en formato OGG.
Cuando solo se cuenta con los archivos mp3, los browsers Safari y ópera no responden. En estos casos conviene poner algún llamado de atención.
http://www.edutecne.utn.edu.ar/audio/sonido_en_web.pdf

[ AGOSTO 09 2016]

Anclas :
Navegación dentro del mismo documento.

<a>   para hipervínculos, hiperenlaces.
<a  href="doc" target="self" >  </a>

Algunas recomendaciones:
* No dejar espacios en blanco.
* Sin caracteres especiales.
* Una ayuda rápida podría ser: 
<title=visualiza> 》》
cuadro sorpresa 

La etiqueta target="blank"
Abre una nueva pestaña

La etiqueta target="self"
Carga en la misma página 








martes, 2 de agosto de 2016

[ AGOSTO 02 2016]


HOY SE EXPLICO EL TEMA DE TABLAS


PARA TENER EN CUENTA CADA TERMINO Y NO CONFUNDIR COMO PUEDE PASAR.


como podemos ver en este ejercicio sencillo:
  • Ahí se puede ver en el ejercicio que en la linea 4 a la etiqueta <table> le agregamos width  que se refiere al ancho, además de 85px se puede
  • colocar también como opción 85%

  • Las filas llevan la etiqueta <tr>

  • Las celdas llevan la etiqueta <td>





quedaría así en la pagina web:

1 ejercicio
              

PARA HACER UNA TABLA DE 2 FILAS, 1 COLUMNA


2 ejercicio
 

LA ANTERIOR TABLA CONSTA DE 2 FILAS Y 2 COLUMNAS.

lunes, 1 de agosto de 2016

[ JULIO 26 2016]

SE REALIZO EVALUACION 

Las tablas se usan cuando necesitamos mostrar "datos en formato de tabla", o sea, información que se presenta de forma lógica en filas y columnas.

¿Es díficil?

Construir tablas con HTML puede parecer, al principio, complicado, pero si no pierdes la calma y andas con ojo, en realidad es de lo más lógico: como todo en HTML.

Ejemplo 1:

        <table>
          <tr>
               <td>Celda 1</td>
               <td>Celda 2</td>
          </tr>
          <tr>
               <td>Celda 3</td>
               <td>Celda 4</td>
          </tr>
        </table>
              

¿Qué diferencia hay entre 
<tr> y <td>?

Como observarás en el ejemplo anterior, éste es probablemente el ejemplo más complicado de código HTML que hemos escrito hasta el momento. Vamos a desglosarlo y a explicar las diferentes etiquetas:
Para insertar tablas se usan 3 elementos diferentes:
  • La etiqueta de inicio <table> y la etiqueta de cierre </table> inician y finalizan la tabla. Lógico.
  • <tr> es la abreviatura de "table row" (es decir, fila de la tabla) e inicia y finaliza las filas horizontales. Lógico también.
  • <td> es la abreviatura de "table data" (es decir, datos de la tabla). Esta etiqueta inicia y finaliza cada una de las celdas que componen las filas de la tabla. Todo sencillo y lógico.
Y esto es lo que ocurre en el ejemplo 1: la tabla empieza con <table>, seguida de <tr>, que indica el inicio de una nueva fila. Se insertan dos celdas en esta fila: <td>Celda 1</td> y<td>Celda 2</td>. La fila se cierra a continuación con </tr> e inmediatemente después se inicia una nueva fila con <tr>. La nueva fila contiene dos celdas. Y por fin la tabla se cierra con</table>.
Vamos a dejarlo claro:
las filas son líneas horizontales de celdas y las columnas son líneas verticales de celdas:


Celda 1
Celda 2
Celda 3
Celda 4

La celda 1 y la Celda 2 forman una fila, mientras que la Celda 1 y la Celda 3 forma una columna
.

En el ejemplo anterior, la tabla consta de dos filas y dos columnas. Sin embargo, una tabla puede contener una cantidad ilimitada de filas y columnas.