Barras de Porcentaje con CSS

Barras de Porcentaje con CSSEl uso del CSS se ha extendido bastante afortunadamente y ayudado a que la Internet y sus sitios web conserven una semántica, estructura y diseño mas cuidados, aunque los navegadores no sea los mas óptimos, pero bueno esa historia para otro dia.

Bueno en pixelspread nos presenta un sencillo tutorial para crear barras de porcentaje usando CSS, el autor del tutorial nos propone 3 formas de hacer esto, mediante:

  • Hojas de Estilo
  • Directo de una capa (div)
  • Según la posición del fondo de la capa

De las tres creo la mejor seria, la segunda “Directo de una capa” ya que si utilizamos php o javascript para procesar e imprimir nuestras consultas, seria mas fácil y directo pasar las variables que nos dibujen la barra de porcentaje, las barras del tutorial no necesitan ni PHP ni Javascript solo CSS.

Demo del tutorial aplicado

via PixelSpread

comment ¿Que opinas?

Artículos recientes

close

Ya puedes crear álbumes de fotos en Instagram

Instagram continua evolucionando y agregando cada vez mas mejores, aunque seamos sinceros las últimas no han sido precisamente innovaciones, mas bien han sido copias de funciones que ya tenía Snapchat, pero bueno la última actualización…

close

play_circle_outline Genial timelapse que muestra la evolución del NY Times y la fotografía periodística

El NY Times es uno de los iconos periodísticos en el mundo actual; sin embargo muchas veces no nos ponemos a pensar como es que llego a ser lo que es hoy en día. Es…

close

Diseños de folletos hechos de cartón; un gran ejemplo de diseño sustentable

El diseño sustentable es una de las tendencias con más fuerzas en este 2017; esto debido a la creciente tendencia de los diseñadores de ser amigables con el ambiente. Es por eso que el diseñador irlandés Ryan…

close

Dilapidation, una genial serie fotografica sobre lugares olvidados

James Kerwin es un fotógrafo con sede en Norwich quien ha comenzó un proyecto fotográfico centrado en la documentación de lugares abandonados. Este fotógrafo ha recorrido diversas partes del mundo localizando edificios y lugares dejados…

close

Propeller, un framework para crear paginas web que combina Bootstrap + Material Design

Propoller es nuevo framework para diseño de paginas web que integra dos de los frameworks mas populares, Bootstrap y Google’s Material Design, entonces podríamos decir que Propeller es un mashup de frameworks que combina lo…

close

Tips de fotografía según el tipo de lente que utilices

Les comparto una serie de infografías realizadas por Canon en la que nos ofrecen algunos tips de fotografía según el tipo de lentes que utilicemos, cada infografía abarca un tipo de lentes distinto desde los…

notifications Recién publicamos
close