Editar el CSS “on the fly”
Sábado, 8 de Octubre de 2005Paso 1: Usa mozilla firefox. Si no conoces el mejor navegador que hay, bajatelo de aqui.
Paso 2: Bajate la extensión Web Developer de aqui. La instalas y reinicias Firefox.
Paso 3: Utiliza un buen color picker. Tras mucho buscar, el mejor que he encontrado es el de pkworld. Descarga directa desde aqui.
Si conoces un Color Picker mejor, dimelo.

Paso 4: Abre tu pagina cuyo CSS quieras editar (asegurate de que la extension Web Developer esta instalada)
Paso 5: Pulsa CTRL+MAYUS+Y (CSS, View style information). Con esto conseguiras que al pasar el cursor por encima de cualquier parte del html, la barra de estado te muestra el estilo CSS que se aplica.
Paso 6: Pulsa CTRL+MAYUS+E (CSS, Edit CSS). Te abre un panel lateral donde puedes modificar al vuelo las CSS de la pagina html que se este mostrando. Ojo, si cambias de pagina en el navegador, se perderan los cambios del CSS cuando vuelvas a la pagina inicial cuyo CSS estabas editando. Asegurate de copiar y pegar a tu editor de textos favoritos los cambios que vayas haciendo en los CSS.
Paso 7: Disfruta
















Diciembre 17th, 2005 8:48 pm
Paso a probar esta extensión.
Con respecto al pkworld no lo he utilizado. De momento uso el ColorPic. No sé si lo conocerás. Me resulta sencillo para mis necesdades ocasionales.
Agosto 1st, 2006 12:02 am
[…] Una vez hecho todo esto, nos queda ir fichero por fichero y modificarlo para darle el aspecto que queramos y traducirlo. Si quieres, puedes utilizar este truco para modificar los css “on the fly” de tu blog desde el propio navegador. Te ahorrarás muchísimo tiempo. […]
Agosto 24th, 2006 4:28 pm
[…] Si eres programador-diseñador web creo imprescindible esta extensión para Firefox. Entre la multitud de opciones podrás editar el CSS “on the fly”. […]
Agosto 24th, 2006 4:31 pm
[…] Si eres programador-diseñador web creo imprescindible esta extensión para Firefox. Entre la multitud de opciones podrás editar el CSS “on the fly”. […]
Agosto 14th, 2007 10:42 am
No conocia el colorpicker en cuestión, pero si el webdeveloper de firefox. Pero para utilidad total a la hora de gestionar y cambiar tanto los css como las etiquetas html al vuelo, os recomiendo la extensión Firebug, Una vez instalado pulsas F12 y se te abre un frame en la zona de abajo del navegador, con el código html del sitio, segun vas abriendo los selectores, te va marcando en la página con un recuadro a que parte del codigo se refiere, y en un panel lateral los css heredados y actuales. Lo mejor es que haciendo doble clic sobre cualquier elemento te permite cambiarlo al vuelo…
Una pasad, tan util o mas que el webdeveloper.
Un saludo
Septiembre 23rd, 2007 9:55 pm
[…] Si eres programador-diseñador web creo imprescindible esta extensión para Firefox. Entre la multitud de opciones podrás editar el CSS “on the fly”. […]