Bueno, esta dirección de internet pretende orientarnos en la elección de nustra primera distribución Linux. Es evidente que, llevados unos años utilizando Linux, cada usuario sepa qué pros y contras tiene cada distribución con respecto al trabajo que lleve a cabo. Así es que, para aquellos que comiencen o quieran comenzar a utilizar Linux y no sepan qué distribución instalar: Haced el test!
Centrar imágenes en CSS
•abril 17, 2009 • Deja un comentarioUno de los problemas que he encontrado a la hora de diseñar con CSS, es centrar las imágenes. Así es, tan simple como eso, lo que se solucionaba con un simple <center></center> en HTML, usando css no parece tan sencillo. Soluciones?
Pues existen dos soluciones posibles (a lo mejor hay más pero son las únicas que he probado)
1- Asignamos a la etiqueta img la propiedad de “elemento de bloque” y al “margin” el valor “auto”, de esta manera el navegador asignará margenes proporcionales al espacio donde está contenida la imagen.
img { display: block; margin: auto; }
Lamentablemente esta solución no es viable en Internet Explorer (para variar), lo cual nos fuerza a buscar otra manera de hacerlo.
2- Esta es la manera como vengo haciéndolo, no es la más elegante pero funciona, para eso le daremos la propiedad text:align-center
al cuadro contenedor de nuestra imagen, por ejemplo:
<div style="text-align:center"><img src="http://direccion/de/la/imagen.jpg"/></div>
Con lo cual habremos centrado la imagen.
Fuente: http://blog.almadark.com
Diseñar en CSS para Firefox, IE6, IE7,…
•abril 16, 2009 • 1 comentarioEn el proceso de diseño de nuestras páginas web nos hemos encontrado con un problema, que imagino han tenido alguna vez todos los diseñadores: las páginas y estilos CSS no se muestran de igual forma en Firefox, Internet Explorer 6, Internet Explorer 7, u otros navegadores no tan populares. Lo que en Firefox se vicualiza como nosotros hemos planeado suele aparecer bastante descolocado en cualquier versión de Internet Explorer existentes hasta el momento.
Las causas de estas diferencias son muchas y muy variadas, pero saber cuales son no es el objetivo de este post (aunque éste es un tema importante), sino más bien, cómo poder resolverlas de una forma más que eficiente. Así que para ello serán indicados una serie de hacks (trucos) o formas de implementar nuestro código CSS de forma correcta.
1- En el código HTML deberemos incluir las siguientes entencias, entre las etiquetas <head></head>, evidentemente:
<!--[if lt IE 6]--> <link rel="stylesheet" type="text/css" src="css_ie6.css"> <![endif]--> <!--[if IE 7]--> <link rel="stylesheet" type="text/css" src="css_ie7.css"> <![endif]-->
De esta forma, Firefox y todos los demás navegadores excepto Internet Explorer leerían la hoja de estilos general. Mientras que El IE se comportaría con las hojas de estilo que hemos creado aposta para él.
2- Escribiendo # delante de la propiedad css , solo se aplicará a a Internet Explorer, y si escribimos un _ antes de a propiedad, solo se aplicará a Internet Explorer 6.
.miClase{ width: 15px; /* Para todos los navegadores */ #width: 20px; /* Para IE */ _width: 25px; /* Para IE 6 */ }
3- Finalmente, también podemos utilizar formas válidas de definir los elementos del CSS pero que solo entienden algunos navegadores. De esta forma podemos añadir pequeños arreglos en un mismo archivo css sin que por ello nuestro código deje de validar.
#miDiv { Código para todos los navegadores } * html #miDiv { Código para IE 6 } *:first-child+#miDiv { Código para IE 7 } #miDiv { Código para IE 8\9 } -- #miDiv { float: right\9; } html>body #miDiv { Código para FF }
4- Y un resumen de más cosillas (otros navegadores incluídos) entremezcladas para acabar de liarla más aún.
* html #uno { color: red } /* IE 6 y anteriores */ *:first-child+html #dos { color: red } /* IE 7 y anteriores */ html>body #tres { color: red } /* IE 7 y navegadores modernos */ html>/**/body #cuatro { color: red } /* Navegadores modernos (IE 7 no) */ html:first-child #cinco { color: red } /* Opera 9.27 y anteriores */ html[xmlns*=""] body:last-child #seis { color: red } /* Safari */ body:nth-of-type(1) #siete { color: red } /*safari 3+, chrome 1+, opera9+, ff 3.5+ */ body:first-of-type #ocho { color: red } /* safari 3+, chrome 1+, opera9+, ff 3.5+ */ @media screen and (-webkit-min-device-pixel-ratio:0) { #diez { background: #FFDECE; border: 2px solid #ff0000 } /* saf3, chrome1+ */ }
Interfaces gráficas de usuario: Java Swing
•noviembre 9, 2008 • 3 comentariosCuando se creo swing se hizo con el objetivo de evitar tener que usar los componentes gráficos nativos de cada sistema operativo, y crear una interfaz que fuera la misma en cualquier sistema operativo. Además el tener que usar los componentes nativos generaba problemas ya que no se sabe como se comporta la aplicación según el sistema operativo en el que fuese lanzado, al estar swing enteramente desarrollado en Java aumenta su portabilidad asegurando un comportamiento idéntico en diferentes plataformas.
Para crear una interfaz gráfica con swing se siguen los siguientes pasos:
1. Declarar los componentes que usaremos y crearlas.
2. Añadirlas al contenedor o al componente correspondiente.
3. Registrar los eventos que puedan ocurrir ( lo explicare en otro post ).
Primero hay que crearse una ventana pero la diferencia es que para poder añadir los componentes hace falta crearse un contenedor con la clase Container que almacene los componentes. Para crear un contenedor se pone:
Container contenedor=ventana.getContentPane();
En swing también existen los paneles de awt pero se llaman JPanel y tiene la misma funciones que los Panel .
JPanel panel=new JPanel();
En swing hay mas tipos de paneles como JScrollPane ( muestra barras de desplazamiento ), JRootPane , etc. Son paneles para mejorar un poco los componentes que se le añaden o para dar alguna función extra.
A continuación tenéis un ejemplo de interfaz gráfica con swing:
-
import java.awt.*;
-
import java.awt.event.*;
-
import javax.swing.*;
-
import javax.swing.event.*;
-
class MiListasFrames {
-
//declareamos
-
private Container contenedor;
-
//Ventana
-
private JFrame ventana;
-
//etiqueta
-
private JLabel etiqueta;
-
//campo texto
-
private JTextField texto;
-
//eleccion
-
private JComboBox marcas;
-
//lista
-
private JList lista;
-
String complementos[]={ «ABS»,«Aire-Acod»,«Air-Bag»,«Direc-Asis»,«EE»,«Pintura met.»,«Radio» };
-
boolean marcaEligida=false;
-
public MiListasFrames() {
-
//crear ventana
-
ventana=new JFrame();
-
ventana.setSize(330,194);
-
ventana.setTitle(«Concesionario»);
-
contenedor=ventana.getContentPane();
-
//crear etiqueta
-
etiqueta=new JLabel(«Selecciona marca y equipamiento»);
-
//crear campo texto
-
texto=new JTextField();
-
texto.setEnabled(false);
-
//crear eleccion
-
marcas=new JComboBox();
-
marcas.setFont(new Font(«Arial»,Font.PLAIN,10));
-
marcas.addItem(«Citroen»);
-
marcas.addItem(«Fiat»);
-
marcas.addItem(«Ford»);
-
marcas.addItem(«Opel»);
-
marcas.addItem(«Peugeot»);
-
marcas.addItem(«Renault»);
-
marcas.addItem(«Seat»);
-
//crear Lista
-
lista =new JList(complementos);
-
//añadimos a ventana
-
contenedor.add(«North»,etiqueta);
-
contenedor.add(«South»,texto);
-
contenedor.add(«West»,marcas);
-
contenedor.add(«East»,lista);
-
//registramos eventos
-
lista.addListSelectionListener(new ManejadorListSelectionListener());
-
marcas.addItemListener(new ManejadorItems());
-
//Registramos el evento de cerrar la ventana
-
ventana.addWindowListener(new CerrarVentana());
-
ventana.setVisible(true);
-
}
-
class ManejadorItems implements ItemListener {
-
public void itemStateChanged(ItemEvent i) {
-
texto.setText(«»);
-
lista.clearSelection();
-
marcaEligida=true;
-
}
-
}
-
class ManejadorListSelectionListener implements ListSelectionListener {
-
public void valueChanged(ListSelectionEvent l) {
-
String acum=«Marca:»+marcas.getSelectedItem()+«#»;
-
if(marcaEligida) {
-
Object seleccionados[]=lista.getSelectedValues();
-
for(int index=0;index<seleccionados.length;index++)
-
acum+=seleccionados[index]+«*»;
-
texto.setText(acum);
-
}
-
else
-
texto.setText(«Debe seleccionar una marca primero»);
-
}
-
}
-
public static void main(String args[]) {
-
new MiListasFrames();
-
}
-
}
Unidades de medida en LaTeX
•octubre 3, 2008 • 1 comentarioBueno, la información listada en este post aparece en el libro «The LaTeX Companion» (página 855) e indica las diferentes unidades de medida disponibles en LaTeX.
sp Scaled point Es la unidad más pequeña de TeX (65536 sp = 1 pt)
pt Punto Equivale a 0.351 mm o 1/(72.27) pulgadas
bp Punto grande Equivale a 0.353 mm o 1/72 pulgadas (se le conoce como Punto Postscript)
dd Punto Didôt Equivale a 0.376 mm o 1/72 de la pulgada francesa
mm Milimetro Equivale a 2.845 puntos
pc Pica Equivale a 4.218 mm o 12 puntos
cc Cicero Equivale a 4.531 mm o 12 puntos Didôt
cm Centímetro Equivale a 10 mm o 2.371 picas
in Pulgada Equivale a 25.4 mm o 72.27 puntos o 6.022 picas
ex Equis Altura de la letra «x» del tipo en uso
em Eme Ancho de la letra «M» del tipo en uso
mu Unidad matemática 18 mu equivalen a 1 em
Algo muy a tener en cuenta si ya queremos pulir, más si cabe, el documento que estemos creando con un diseño estético más avanzado.
Bibliografías en LaTeX
•julio 24, 2008 • 7 comentariosComo en todo, no hay una única manera de hacerlo. Normalmente si se trata de una bibliografía corta y no estamos interesados en reutilizar los datos bibliográficos la elección habitual es escribirla “a mano” mediante el comando \thebibliography
. Para utilizar datos bibliográficos reutilizables, largos o complejos es preferible emplear la utilidad BibTeX.
El manejo de la bibliografía es semejante al de las referencias, de lo cual ya hemos hablado. En ambos casos, cada registro bibliográfico tiene una etiqueta. Cuando, en una determinada posición del texto, queremos hacer referencia a un registro, hacemos uso del comando \cite{etiqueta}
. LaTeX ya se encarga de colocar el número o referencia que corresponde a esa entrada y, en el apartado de bibliografía, coloca los datos de la entrada. En caso de que queramos escribir los datos pero no queremos poner una referencia en el texto, utilizamos \nocite{etiqueta}
.
El entorno \thebibliography
\begin{thebibliography}{n}
\bibitem{etiqueta}datos
…
\end{thebibliography}
donde etiqueta es la etiqueta que identifica la entrada y datos son los datos de la entrada. Por ejemplo:
\begin{thebibliography}{9}
\bibitem{Knuth}D. E. Knuth, “The TeXbook”, Addison–Wesley, 1984
\end{thebibliography}
BibTeX
BibTeX es un entorno más complejo para tratar bibliografía, pero es extremadamente útil y fácil de usar. Además, permite reutilizar los ficheros de bibliografía que escribamos para otros
proyectos.
En primer lugar, generamos un fichero al que pondremos un nombre con extensión .bib
; por ejemplo mibiblio.bib
. En nuestro caso podría contener lo siguiente:
@book{Knuth,
author=”Donald E. Knuth”,
title=”The {T}e{X}book”,
publisher=”Addison–Wesley”,
year=1984,
}
El campo @book
nos indica qué tipo de registro es. Hay muchos: para libros, artículos, tesis, manuales, etc. Consulta la documentación de BibTeX para conocerlos. Knuth
es la etiqueta que identifica el registro que luego citaremos con \cite
. El resto del archivo está claro qué es. Puede sorprender el uso de {} en el título. Esto se debe a que BibTeX maneja automáticamente las mayúsculas y minúsculas: el la forma de indicarle que no debe modificar lo que va dentro, pues de lo contrario lo pondrá en letras minúsculas..
En el documento en el que queremos poner la bibliografía debemos incluir las siguientes líneas:
\bibliographystyle{estilo}
\bibliography{mibiblio.bib}
Donde estilo es el tipo de estilo que queremos para nuestra bibliografía. Hay varios estilos predefinidos (consulta el manual) y puedes crear los tuyos propios. Yo suelo utilizar el estilo plain que ordena las entradas alfabéticamente y las referencias son numéricas. en cuanto al comando \bibliography{mibiblio.bib}
debemos colocarlo allí donde queramos insertar la bibliografía.
Vale ¿y ahora? Pues hay que compilar el documento: latex documento
. Pero no sale la bibliografía. ¿Por qué? Porque en esta primera pasada LaTeX ha ido recogiendo las citas bibliográficas (los \cite
y \nocite
que has puesto) y los ha puesto en un fichero auxiliar. Ahora debes ejecutar bibtex documento
(¡ojo! no bibtex mibiblio
). Ahora BibTeX lee el fichero auxiliar y coge las entradas del fichero bibliográfico y genera ya el índice bibliográfico con las entradas utilizadas. Si ahora ejecutas de nuevo latex documento
LaTeX se encontrará el índice bibligráfico ya generado y lo inserta donde toca. Esta secuencia de comandos solo debe ser repetida cada vez que cambies la bibliografía.
Fuente: SalvaDigital.
Windows 7, para Enero del 2010
•julio 23, 2008 • Deja un comentarioEl vicepresidente de Microsoft, Bill Veghte, ha confirmado en una carta enviada a socios y clientes empresariales que el próximo sistema operativo de escritorio de la compañía será comercializado en enero de 2010.
El vicepresidente de Microsoft explicó que la comunicación de la fecha oficial venía motivada por la petición de sus clientes de conocer un calendario concreto para la liberación del próximo Windows, más con la retirada de las ventas de XP el 30 de junio.
Veghte, como no podía ser de otra forma, aprovechó para alabar las virtudes de Vista, aunque otras partes de su nota indiquen claramente que Microsoft no está satisfecho con la implantación de Vista.
Veghte abordó una de las principales críticas del cliente empresarial (al que iba dirigida la carta) como la falta de compatibilidad de las aplicaciones cuando fue lanzado Vista, pidiendo que fueran comunicadas a la compañía. “Nuestra meta es garantizar que el proceso de migración de Windows Vista a Windows 7 sea sencillo”.
Fuente: The Inquirer
25 razones de peso para migrar a GNU/Linux
•May 19, 2008 • Deja un comentario26 – Existen en realidad más de 25 razones por las que organizaciones de todo el mundo están migrando a GNU/Linux. Un vigésimo sexto motivo es que con GNU/Linux no hay necesidad de desfragmentar los discos duros a diferencia de Windows. La fragmentación, que es la difusión de datos en lugares no contiguos puede reducir la eficacia del almacenamiento de datos y ralentizar el funcionamiento de la máquina. Desfragmentar no es difícil, pero puede ser una molestia tener que hacerlo periódicamente, y no es necesario si tienes un sistema operativo bien diseñado.
Conocer las características de nuestra CPU
•abril 30, 2008 • 6 comentariosPara conocer las características de la CPU (procesador) sobre el que estamos trabajando sólo tenemos que visualizar el fichero «cpuinfo» de la siguiente forma:
cat /proc/cpuinfo
De esta forma obtendremos en la consola algo como:
processor : 0
vendor_id : GenuineIntel
cpu family : 6
model : 13
model name : Intel(R) Pentium(R) M processor 1.73GHz
stepping : 8
cpu MHz : 1729.000
cache size : 2048 KB
fdiv_bug : no
hlt_bug : no
f00f_bug : no
coma_bug : no
fpu : yes
fpu_exception : yes
cpuid level : 2
wp : yes
flags : fpu vme de pse tsc msr pae mce cx8 apic sep mtrr pge mca cmov pat clflush dts acpi mmx fxsr sse sse2 ss tm pbe up bts est tm2
bogomips : 3461.81
clflush size : 64
Así de simple y fácil.
Mantener datos al enviarlos a través de un formulario
•abril 9, 2008 • 9 comentarios¿Has visto alguna vez formularios que al enviar los datos te devuelven un mensaje indicando que te hace falta llenar uno de sus campos? Seguramente, sí. Y ¿has visto que existen formularios que al indicar que te hace falta llenar uno de sus campos vacíos, te devuelven en blanco los otros campos que habías llenado?
Vamos a ver cómo implemetar de una forma sencilla -en PHP y XHTML- para evitar que hagamos perder tiempo a la gente y si le vamos a pedir que llene los campos que tú necesitas, pues al menos le hagamos el favor de conservar la información que ya se mandó.
Básicamente, el truco está en el value, donde lo que debemos hacer es:
input type="text" name="nombre_campo" value="< ?php if (isset($_POST['nombre_campo'])) echo $_POST['nombre_campo']; ?/>"
Lo que hace ese PHP es revisar que si la variable se ha enviado por el método post y ya tiene un valor asignado, la imprime.