es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


Desarrollador: Depurar elementos DOM en su página con una línea de código

¿Cuántas veces has tenido problemas para encontrar un problema específico que estropee tu diseño de CSS? Desde las etiquetas de cierre faltantes hasta los hermanos anidados incorrectamente, los problemas de CSS son una moneda de diez centavos. Y con este depurador de diseño CSS, el proceso se hizo mucho más fácil .

Esta línea de código atravesará el DOM y perfilará cada elemento con un color diferente. De esta forma, puede visualizar mejor cómo funciona su CSS (o no funciona) y detectar rápidamente las áreas problemáticas .

GitHub permite a los desarrolladores guardar pequeños trozos de código llamados Gists. Todos son de código abierto y pueden guardarse para su propio uso . Es por eso que este depurador CSS es muy útil. Combina la destreza moderna de Chrome DevTools con la simplicidad de bookmarklets del navegador .

Para usar este código, primero debe copiar la versión que más le guste de la página Gist. Luego, pegue ese código en su ventana de Terminal y ejecútelo . Deberías terminar con un resultado como este :

Ahora, es posible guardar este código como un marcador en la barra de herramientas de su navegador. Pero si eres un usuario de Chrome, puedes guardar este código JS como un fragmento de código que es mucho más fácil de ejecutar.

Este fragmento de código se puede recuperar una y otra vez con un clic de un botón. Puede analizar todas las páginas, llenas de estos coloridos contornos CSS, para los elementos DOM de padres e hijos por igual.

Sin embargo, no debes sentirte limitado solo a Chrome. Este fragmento funciona para todos los principales navegadores, incluidos Firefox, Safari, Opera e Internet Explorer.

Y para cualquiera que tenga curiosidad por saber cómo funciona esto, puede consultar la versión anotada con comentarios para cada línea de código.

Este Gist está lleno de comentarios de usuarios relacionados y actualizaciones de otros desarrolladores que ayudan a hacerlo más pequeño y más eficiente. Pero en su estado actual, esta es una de las formas más simples de depurar cualquier DOM con una sola línea de código .

Cómo dar Crítica Constructiva

Cómo dar Crítica Constructiva

Internet nos ha lavado el cerebro para hacernos creer que podemos envejecer , pero no tenemos que crecer, pero uno sabe que tiene que hacerlo, eventualmente; los billetes no se pagan solo. Cuando trabajamos en el mundo freelance, todos amamos trabajar con adultos; personas de las que podemos depender para entregar lo que necesitamos

(Consejos de tecnología y diseño)

Más de 30 plantillas de botones "Llamar a la acción" para descargar

Más de 30 plantillas de botones "Llamar a la acción" para descargar

Casi no hay ningún sitio web que no tenga dos tipos de botones, a saber; botones de redes sociales y botones de llamado a la acción. Si bien el primero es un tema completamente diferente, en este post, estoy presentando las plantillas de botones de llamado a la acción para descargar .Como los diseñadores web siempre están buscando una nueva colección de botones de llamado a la acción a su disposición, aquí hay una colección de plantillas de botones de llamado a la acción que van desde HTML, CSS y JavaScript hasta formatos de Photoshop diseñados profesionalmente . Vamos a ve

(Consejos de tecnología y diseño)