Archivo de la etiqueta: imagen

Imágenes de fondo en CSS


Para incluir imágenes de fondo en CSS utilizaremos las propiedades background-image para indicar la ruta de la imagen, background-position para establecer la alineación vertical y horizontal de la imagen y background-repeat.

El uso de background-repeat se debe a que si la imagen es más pequeña que el elemento se repetirá por defecto, horizontal y verticalmente hasta ocupar todo el espacio disponible. Si queremos modificar este comportamiento, se puede hacer con los valores no-repeat (no se repite), repeat-x (se repite horizontalmente) y repeat-y (se repite verticalmente).

Asimismo, con la propiedad background-size especificaremos el tamaño de la imagen.

De esta forma hemos diseñado una web con imágenes de la Mezquita de Córdoba, creando tres bloques <div> de 200px de ancho y 200px de alto. Hemos asignado a cada uno de los bloques una imagen de fondo de 50×50 y un borde distinto. Además, se cumplen los siguientes requisitos:

  • En el primer bloque la imagen de fondo no se repite y está centrada tanto vertical como horizontalmente.
  • En el segundo bloque, la imagen se repetirá horizontalmente y estará situada en la parte inferior.
  • En el tercer bloque, la imagen se repetirá verticalmente y se situará a la derecha.

El resultado es el que aparece en la imagen de abajo.

act1p79

El código HTML y CSS para obtener este resultado se muestra a continuación.

htmlact1p79

cssact1p79

Anuncios

Preguntas para la prueba de multimedia


A continuación os expongo las cuestiones para preparar la prueba de multimedia:

  1. ¿Qué permite la multimedia?
  2. ¿Cómo podemos capturar una imagen de la pantalla?
  3. ¿Qué es gPaint?
  4. Define imagen vectorial.
  5. Define mapa de bits.
  6. ¿Qué es el GIMP?
  7. Escribe tres extensiones de archivos de imagen.
  8. ¿Para qué sirve la caja de herramientas de GIMP?
  9. ¿Qué es la ventana de imagen de GIMP?
  10. Cuando utilizamos GIMP trabajamos con capas. ¿En qué consiste esto?

Trabajando la imagen digital


En la unidad correspondiente a multimedia nos vamos  a centrar en la imagen. Tras una introducción sobre la imagen digital, trabajaremos con el GIMP.

En el enlace de abajo encontraréis el material para trabajar las actividades de introducción planteadas.

MATERIAL PARA TAREAS INTRODUCTORIAS

Gimp_2.4.3

Asimismo, las tareas con GIMP a realizar se encuentran alojadas en la web del Instituto Máquina-Herramienta. Más abajo tenéis los enlaces, divididos en partes.

gimp-tanda1villalba

imágenes_para_tanda1villalba

gimp-tanda2villalba

imágenes_para_tanda2villalba

gimp-tanda3villalba

imágenes_para_tanda3villalba

gimp-tanda4villalba

imágenes_para_tanda4villalba

Retoque fotográfico: GIMP


GIMP es un software libre que nos permite realizar operaciones de retoque fotográfico.

GIMP_2.8_for_Windows_screenshot

En la red podemos encontrar mucha información sobre este programa. Nosotros vamos a trabajar con los apuntes alojados en la web www.edu.xunta.es.

Como complemento a las actividades, en los enlaces de abajo encontraréis las imágenes necesarias:

imágenesGIMP1

imágenesGIMP2

imágenesGIMP3

imágenesGIMP4

Practicando con GIMP


Con el retoque fotográfico vamos a corregir o mejorar imágenes digitales. Uno de los programas que podemos utilizar para realizar el retoque es el GIMP, que además es software libre.

Vamos a realizar una práctica de retoque, eliminando las arrugas de un rostro. Esta práctica la he seleccionado de una colección de actividades del Instituto de la Máquina-Herramienta.

2000px-The_GIMP_icon_-_gnome.svg

En este enlace os podéis descargar el archivo xcf (extensión para un proyecto en GIMP) que contiene el rostro a retocar: ROSTRO A RETOCAR.

 

 

Imágenes vectoriales


Una imagen vectorial es una imagen digital formada a partir de ecuaciones matemáticas. Así, una imagen se construirá a partir de una secuencia de fórmulas matemáticas que desarrollan cada una de las formas geométricas que componen la imagen.

cell-42403

Al ampliar una imagen vectorial no vamos a detectar el pixelado que se produce con las imágenes de bits o de puntos. Sin embargo, las imágenes vectoriales tendrán menos definición.

Para trabajar las imágenes vectoriales en clase vamos a realizar esta colección de prácticas que Luis Garrido de Paz ha recopilado en su web, utilizando el programa OpenOffice Draw.

 

practicasdraw

 

Tratamiento de las imágenes: GIMP y OpenOffice Draw.


El alumnado de 4º de la ESO está trabajando estos días el tratamiento de la imagen, y especialmente el uso del programa GIMP.

Aquí os dejo el enlace de unos apuntes del Instituto de Máquina-Herramienta que vamos a seguir para complementar la información ya explicada. Son muy interesantes.

Además, para trabajar también con el OpenOffice Draw os propongo esta actividad del blog harotecno. Siguiendo los pasos que se indican confeccionareis una mandala.