Fragmentos de código 2024, Diciembre

Cuando se convierte un número sin unidades a una longitud, duración, ángulo o lo que sea, la gente tiende a agregar la unidad como una cadena, así: $ valor: 42; "

All Usado para todos los dispositivos de tipo multimedia aural Usado para sintetizadores de voz y sonido braille Usado para dispositivos de retroalimentación táctil braille en relieve Usado para paginado "

Veamos algunas opciones para iterar sobre una NodeList, a medida que regresa de ejecutar un document.querySelectorAll. Hemos escrito un artículo actualizado sobre "

Suponiendo que el elemento padre tiene posición: relativa;, estas cuatro propiedades centrarán un elemento hijo tanto horizontal como verticalmente en el interior, sin importar "

.screen-reader-text (position: absolute; top: -9999px; left: -9999px;) Esta clase puede eliminar un elemento de la página, sacándolo del flujo y no "

Para que el DOM (y por tanto CSS) los reconozca como elementos reales: (función () (if (! / * @ Cc_on! @ * / 0) return; var e = "

Existe un truco de CSS bastante popular que usa bordes transparentes en un elemento de 0 de ancho / 0 de alto para imitar triángulos. Aquí hay un fragmento de CSS sobre Trucos de CSS "

A (background: url (sprite.png.webp) no-repeat; display: block; height: 30px; width: 250px;) a: hover (background-position: 0 -30px;) The set height and "

Esto funciona: var htmlString = "Esto es una cadena"; Esto falla: var htmlSTring = "Esto es una cadena."; A veces, esto es deseable para facilitar la lectura. Agregar"

Las barras de desplazamiento son uno de esos componentes de la interfaz de usuario que están presentes en casi todas las páginas de Internet, pero nosotros (los desarrolladores) tenemos poco o ningún control sobre ellas ".

Body (familia de fuentes: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; peso de fuente: 300;) "

Donde el es una referencia a una entrada o un área de texto. function moveCursorToEnd (el) (if (typeof el.selectionStart == "number") (el.selectionStart = "

Cuando se trabaja en arquitecturas Sass complejas, no es raro utilizar mapas Sass para mantener la configuración y las opciones. De vez en cuando, verá mapas "

Técnica de imagen de fondo CSS: html (ancho: 100%; altura: 100%; fondo: url (7518965 / absolute_center_vertical_horizontal_an_image_css-tricks.png.webp) center center no-repeat;) CSS + Técnica de imagen en línea: img ("

Los preprocesadores CSS Sass y Less pueden tomar cualquier color y oscurecerlo () o aclararlo () con un valor específico. Pero esta capacidad no está integrada en JavaScript ".

Las curvas de Bézier se pueden usar para agregar hermosos efectos a las transiciones y animaciones CSS. Escribir la notación funcional completa (por ejemplo, cubic-bezier (0.550, "

Enlace a archivos CSS Básicamente, tiene un enlace directo a archivos CSS en Google.com. A través de los parámetros de URL, especifique qué fuentes desea y qué "

Esto es mejor que hacer el evento tradicional "window.onload", ya que puede adjuntar varios controladores de eventos a un solo evento y todos se llaman ".

Cuando se trata de números en JavaScript o cualquier otro lenguaje de programación, existe una forma de truncar un número después de n dígitos. Desafortunadamente no hay"

Haga que el color del texto sea transparente pero agregue una sombra: .blur (color: transparent; text-shadow: 0 0 5px rgba (0,0,0,0.5);) Borroso Más navegadores admiten el color "

ACTUALIZACIÓN: Esto es bastante antiguo. Si está buscando imágenes de carga diferida en estos días, le recomiendo que consulte: La guía completa para la carga diferida de imágenes Un nativo "

Al extender un selector con la directiva @extend, Sass no toma el contenido CSS del selector extendido para ponerlo en el extensor. Eso"

Solo algunas cosas divertidas con animaciones CSS3. Si le preocupa la compatibilidad con navegadores súper profundos, use un GIF. .loader (text-align: center;) .loader span ("

Realiza una función cada segundo: function myFunction () (// haz algo) var int = setInterval (myFunction, 1000); Cancelarlo: clearInterval (int); "

Para los creadores de bibliotecas y constructores de frameworks, tener un par de funciones adicionales para aplicar funciones dinámicamente a elementos de una lista puede resultar útil. Aquí"

El sitio web de DayTrip utiliza un efecto ordenado en el encabezado de su página que distorsiona la imagen de fondo con una textura granulada animada. El efecto es sutil pero "

Función anónima autoinvocada asignada a la variable global yournamespacechoice. Sirve el efecto de mantener todas las funciones y variables privadas para "

Al profundizar en la teoría del color, existe algo llamado luminancia de color relativa. En pocas palabras, la luminancia de un color define si su "

CSS: * (margen: 0; relleno: 0;) #página (pantalla: tabla; desbordamiento: oculto; margen: 0px automático;) *: primer hijo + html #página (posición: relativa;) / * ie7 * / * html "

Demo de Sagar Ganatra "