Esta tarde he estado trabajando en la página de mecanografía.
El caso es que he perdido muchísimo tiempo para realizar una tarea que en principio parece una chorrada.
Quería hacer una barra de progreso normal y corriente, con un color de fondo, el borde en negro (de un pixel de grosor) y el texto que yo eligiera en el centro.
El problema, como siempre ha venido con la incompatibilidad de los navegadores. Lo que funcionaba en Firefox no funcionaba en Internet Explorer y viceversa. Además también funciona de categoría para Opera.
Finalmente, tras muchos intentos de prueba y error, he conseguido lo que quería. A continuación se puede ver el resultado:
Para los interesados, pinchad aquí para ver el ejemplo de la barra de progresos. Si mirais el código fuente vereis lo sencillito que se ha quedado al final.
Nota: Al final he perdido casi más tiempo tratando de poner la barra de progresos en este artículo (WordPress no me deja poner HTML en plano) que programando la barra de progresos. Finalmente he optado por pasar olímpicamente de poner el ejemplo HTML embedido en este artículo y he puesto la imagen.
Actualización: acabo de leer un artículo bastante completo sobre otras soluciones para dibujar barras de progreso y gráficos. Muy interesante :)
Barra de progreso en HTML y CSS…
Vota este post en teknear.com…
gracias me funciono muy bien
Hola, cuando uso la barra en IExplorer se va al centro, como puedo decirle que se ubique a la izquierda.
Gracias.
@Renzo supongo que si haces un div container posicionado donde quieres, seguramente no habrá problemas… pero tendría que probarlo.
[…] https://www.pausanchez.com/es/2007/11/26/barra-de-progreso-en-html-y-css/ Esta entrada fue publicada en PHP por dario. Guarda el enlace permanente. […]
[…] https://www.pausanchez.com/es/2007/11/26/barra-de-progreso-en-html-y-css/ […]