Hoy comparto con vosotros este enlace donde explican cómo hacer, usando CSS, listas numeradas en HTML con un aspecto muy elegante:
Listas numeradas con estilo en CSS
Listas numeradas con CSS y mucho estilo
Category Archives: HTML y CSS
Android: Mostrar teclado numérico automáticamente en un campo en HTML
Si has preparado algún formulario en HTML en algunos de cuyos campos hay que introducir únicamente datos numéricos te habrás dado cuenta del incordio que es de cara al usuario; tiene que cambiar el modo del teclado para que aparezcan los números y, a veces, al borrar se cambia otra vez al teclado de texto.
Todavía no he encontrado la solución óptima, pero en algunos dispositivos funciona bien lo siguiente: en lugar de usar campos de tipo input, prueba a usar campos tipo number:
<input id="campo" type="number" /> |
Como comento, por ahora funciona en todos los que he probado pero me temo que en algunos dispositivos/navegadores no hace lo que se espera.
Por cierto, esto es HTML5.
Logo HTML5
Redireccionar un directorio con HTTP 301 y expresiones regulares
Hace bastante tiempo escrbí un artículo sobre redirecciones con HTTP 301 para ficheros.
Si queremos mover todos los ficheros contenidos en un directorio, con ese sistema deberíamos hacerlo uno a uno. Para ayudarnos en esta tarea podemos usar RedirectMatch y expresiones regulares:
redirectmatch 301 /antiguo/(.*) http://www.otraurl.com/$1
Lo que encontremos dentro del (.*) se trasladará al $1 en la nueva dirección. Todos los ficheros y carpetas que cumplan con la condición /antiguo(.*), es decir, que contengan /antiguo se redireccionarán al dominio www.otraurl.com.
Para más información puedes investigar sobre expresiones regulares.
AbacoNegocios.com en XHTML 1.0 estricto
Como se suele decir: “en casa de herrero, cuchillo de palo”. Hace unos días me avisaron que la web de Abaco Negocios no cumplía el XHTML estricto. Hoy por fin nos hemos puesto a ello y hemos corregido los 15 errores detectados (alguna etiqueta sin cierre a la que le faltaba la barra ‘/’ al final, alguna imagen sin el ‘alt’ correspondiente y alguna otra cosilla).
Crear sprites con CSS
Hoy me he encontrado vía del.icio.us este interesante artículo que comparto con vosotros:
Creating easy and useful CSS Sprites
Se trata de un artículo que explica cómo hacer sprites con CSS.
Tabla de códigos HTML
He encontrado hoy esta interesante tabla con todos los códigos HTML. Muy útil si quieres saber cuál es el código HTML para los caracteres á, é, í, ó, ú, ñ, €, ©, etc… para poder visualizarlos bien en cualquier navegador.
Buscar la posición de un objeto con Javascript
He encontrado en firetree.net un estupendo script que permite conocer la posición de cualquier objeto de una página html.
Es un script muy pequeño que funciona correctamente en, al menos, Firefox, Internet Explorer, Safari y Opera.
Tenemos que agradecérselo a: Peter-Paul Koch y Alex Tingle.
function findPosX(obj)
{
var curleft = 0;
if(obj.offsetParent)
while(1)
{
curleft += obj.offsetLeft;
if(!obj.offsetParent)
break;
obj = obj.offsetParent;
}
else if(obj.x)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if(obj.offsetParent)
while(1)
{
curtop += obj.offsetTop;
if(!obj.offsetParent)
break;
obj = obj.offsetParent;
}
else if(obj.y)
curtop += obj.y;
return curtop;
}Generador de Lorem Ipsum
¿Necesitas un texto cualquiera para mostrar un diseño? Nada mejor que utilizar el conocido “Lorem Ipsum…”.
Si te dedicas la maquetación de sitios web o documentos seguramente habrás necesitado en más de una ocasión usar un texto cualquiera. Probablemente habrás usado “añfdjfoñafijd fsdñvsdñfjsdaf” pero te habrás dado cuenta de que queda verdaderamente horrible. Lorem Ipsum es casi un estándar en estos casos. Hoy he encontrado esta web que te genera automáticamente textos para rellenar con este conocido texto. Puedes generar los párrafos que necesites, listas o una cantidad de bytes determinada. Muy curioso y, aunque parezca una tontería, muy útil.
¿Diseño con Tablas o CSS?
Muchos nos hemos hecho esta pregunta un montón de veces ¿qué debería usar para diseñar mi web? ¿emplear tablas o únicamente CSS? Hace un tiempo usar CSS no era una opción ya que pocos navegadores lo soportaban, sin embargo hoy en día creo que es la mejor opción.
¿Qué razones me hacen pensar esto?
1) El diseño de la web (y la disposición de elementos) queda independiente de la información de la página.
2) Hacer modificaciones en una web bien diseñada en CSS es mucho más rápido que en una diseñada con tablas. ¿Quién no se ha vuelto loco alguna vez rediseñando una web creada con tablas?
3) Es mucho más cómodo visualizar el código HTML de una web diseñada con CSS. La “limpieza” de una web basada en estilos CSS es incomparable a una hecha con tablas. Si alguien tiene alguna duda que visite CSS Zen Garden o similares.
4) Puedes especificar un diseño distinto para cada medio: por ejemplo, podemos crear una hoja de estilos para el navegador y otra para la impresora. De esta forma, dependiendo de cuál sea el destino de la página (navegador o impresora) se usará una u otra.
5) Las tablas se pensaron para mostrar tablas y no para diseñar webs.
6) Para modificar un sitio hecho con tablas tenemos que subir de nuevo todos los archivos, si modificamos uno creado con CSS basta con subir la nueva hoja de estilos.
7) Por último pero no por ello menos importante… existe una minoría, a la que no se debe olvidar, que necesitar sintetizadores de voz para poder “visualiar” una web. Una web diseñada con CSS será mucho más fácil de entender para ellos.
Colección de tutoriales CSS
A través de Fresqui he encontrado una interesantísima recopilación de tutoriales de CSS. He echado un vistazo superficial a algunos de ellos y verdaderamente prometen, como el de las esquinas redondeadas usando únicamente CSS (sin JavaScript ni imágenes).