Etiquetas HTML (todos los cursos)

13 - junio - 2017

Como sabéis, estamos en pleno tema 3 viendo cómo hacer páginas Web usando el lenguaje HTML y en clase hemos visto y usado muchas etiquetas diferentes.

Como se que podéis liaros un poco con todas ellas, os dejo aquí un resumen de todas las que hemos visto para que lo tengáis a mano o incluso lo imprimáis. Os puede venir muy bien para repasar o como guía rápida a la hora de hacer los ejercicios.

Para imprimirlo solo tenéis que copiar todo el contenido de este artículo en el Word y después imprimís pulsando el botón correspondiente.

Esqueleto o estructura de toda página web:

<html>

<head>

<title> Titulo de la página </title>

</head>

<body>

Contenido de la página

</body>

</html>

Etiquetas y atributos:

<body bgcolor=”red“> Fondo de toda la página de color rojo


<body background=”URL imagen“> El fondo de toda la página será la imagen indicada.


<br/> Salto de línea


<hr color=”red” size=”1“/> Línea horizontal de colo rojo y 1 punto de grosor


<p> …. </p> Define un párrafo. Puede tener un atributo:

  • align=”left”, “center”, “right”, “justify” (configuramos la alineación del texto de este párrafo)

<blockquote> …. </blockquote> Etiqueta para sangrar un párrafo.


<b> …. </b> Negrita

También puedes usar:  <strong> …. </strong>


<i> …. </i> Cursiva


<u> …. </u> Subrayado


<s> …. </s> Tachado


<center> …. </center> Centrado


<marquee> …. </marquee> Mueve el texto. Puede tener dos atributos:

  • direction=”right” , “left” (hacia donde se moverá el texto)
  • bgcolor=”red” (color de fondo del texto)
  • scrollamount=”10″ (define la velocidad del texto)

<h1> …. </h1> Para hacer cabeceras de diferentes tamaños
<h2> …. </h2> el h1 es el mas grande y el h6 el mas pequeño
<h3> …. </h3>
<h4> …. </h4>
<h5> …. </h5>
<h6> …. </h6>


<font> …. </font> Indicamos el tipo de letra, el tamaño y el color del texto con tres atributos distintos:

  • face=”Comic Sans MS” (tipo de letra)
  • size=”12″ (tamaño de la letra)
  • color=”red” (color de la letra)

<sub> …. </sub> subíndices


<sup> …. </sup> superíndices


<img/> Para colocar una imagen. Tiene muchos atributos con los que configuramos la imagen:

  • src=”nombre de la imagen” (indicamos el nombre del archivo que contiene la imagen)
  • align=”left”, “middle”, “right” (indicamos el lugar en el que aparecerá la imagen con respecto al texto de alrededor)
  • border=”1″ (número que indica el grosor del borde que tendrá la imagen)
  • width=”200″ (ancho en píxeles de la imagen)
  • height=”300″ (alto en píxeles de la imagen)
  • hspace=”15″ (espacio que la imagen dejará por la derecha y por la izquierda con el texto que tenga alrededor)
  • vspace=”15″ (espacio que la imagen dejará por arriba y por abajo con el texto que tenga alrededor)

<a> …. </a> Sirve para colocar un enlace en la página. Contiene en su interior el nombre con el que el enlace aparecerá. Tiene un atributo:


<ul> …. </ul> Lista desordenada. Puede tener 1 atributo:

  • type=”circle” , “disk” ó “square” (define el tipo de viñeta: círculo, disco o cuadrado)

<ol> …. </ol> Lista ordenada. Puede tener 2 atributos:

  • type=”a” , “A”, “1”, “I” ó “i” (define el tipo de numeración)
  • start=”1″ (define el comienzo de la numeración)

<li> …. </li> Elemento de la lista


SOFTWARE LIBRE

1 - febrero - 2017

Enlaces para que profundicéis en el tema:

  1. Historia de Linus Torvalds
  2. ¿Qué es el software libre?
  3. Qué es y cómo nació Linux
  4. Mapa conceptual sobre el Software Libre

Por último, tenéis que acceder a cada uno de los enlaces anteriores para contestar en vuestros cuadernos las siguientes preguntas:

  1. ¿Cómo definirías brevemente el concepto de Software Libre?
  2. ¿Es lo mismo software libre que software gratuito?
  3. ¿Qué libertades provee el software libre? (mira en el mapa conceptual)
  4. ¿Qué es lo que programó Linus Torvalds que fue tan importante?
  5. ¿En qué trabaja y de qué se ocupa Linus hoy día? ¿Qué edad tiene actualmente?
  6. Explica brevemente cómo nació el sistema operativo Linux (mira en el último apartado de la tercera dirección).
  7. Enumera las ventajas del software libre sobre el software privado que más te hayan sorprendido.
  8. Pon dos ejemplos de programas que sabes que son software libre y dos ejemplos más de programas que sabes que son software privado.

Puertos de Entrada/Salida

22 - noviembre - 2016

Identifica los puertos de E/S en las siguientes imágenes de placas base:

 


Resumen de puertos de E/S

22 - noviembre - 2016

Una vez que hemos estudiado todos los puertos de E/S actuales, os dejo una imagen que los recopila casi todos.

Ports


Artículo interesante sobre placas base

15 - noviembre - 2016

placas_base

Os recomiendo un artículo reciente sobre placas base que merece la pena leer para cerrar esta parte del tema.

https://www.geektopia.es/es/technology/2014/03/08/articulos/mejores-placas-base-tarjetas-madre-del-momento-por-rango-de-precio.html

Consejos:

  • Apuntad en vuestro cuaderno todas las palabras que no entendáis.
  • Observad la tabla en la que se comparan los diferentes modelos de chipset y las diferentes modalidades proporcionadas.
  • Echad un vistazo a la ficha técnica de alguna de las placas del artículo.
  • Leed detenidamente la parte final del artículo en la que se aconseja cómo elegir una buena placa base.

Arquitectura de Von Neumann y repaso de Hardware (solo para Bachillerato)

14 - noviembre - 2016

En estos momentos en las clases de Bachillerato estamos viendo la arquitectura de Von Neumann. Os recuerdo que es la arquitectura en la que están basados todos los ordenadores actuales aunque fue diseñada por este matemático en el año 1945 estudiando uno de los primeros ordenadores, el ordenador ENIAC.

A continuación, os dejo el dibujo hecho en la pizarra para que podáis verlo exactamente:

von neumann

Algunos enlaces importantes sobre este tema:

También os dejo un esquema de las partes de un ordenador (está sacado de la wikipedia):

Mouse

Vista expandida de un ordenador personal (PC)

1: Monitor

2: Placa base

3: Procesador

4: Puertos SATA

5: Memoria principal (RAM)

6: Tarjetas de expansión

7: Fuente alimentación

8: Unidad de almacenamiento óptico

9: Disco duro

10: Teclado

11: Mouse


Nueva película de StarWars: aprendiendo a programar

10 - noviembre - 2016

¿Recordáis cuando programábamos en clase con Elsa y Anna de Frozen? Acaban de publicar en www.code.org una nueva hora de código basada en la nueva película de StarWars que se va a estrenar en un mes.

El funcionamiento es el mismo aunque en este caso aprenderéis a programar en Javascript. Tranquilos, todo sigue estando basado en bloques que arrastráis y soltáis.

Este es el vídeo de bienvenida (os recomiendo que activéis los subtítulos y la traducción automática al español):

Os dejo el enlace para que empecéis a programar lo antes posible:

https://code.org/starwars

(Pulsad TRY NOW)