Hoy aprendí - Atajo de fuente CSS

Hoy aprendí - Atajo de fuente CSS - Amit Merchant - Un blog sobre PHP, JavaScript, etc.

 

He estado creando sitios web durante más de 10 años y una de las cosas que uso inevitablemente es CSS. Uso mucho CSS y, sin embargo, sigo aprendiendo cosas nuevas sobre él de vez en cuando. Y hoy aprendí el font propiedad abreviada en CSS.

Entonces, digamos que desea establecer el tamaño de fuente, la familia de fuentes, el peso de fuente y el estilo de fuente de un elemento. Puedes hacerlo así.

h1 {
  font-size: 2rem;
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  line-height: 1.5;
  font-style: italic;
}

Pero, usando el font taquigrafía propiedad, puede hacerlo todo de una vez así.

h1 {
  font: italic 500 2rem/1.5 "Roboto", sans-serif;
}

Y si expande la propiedad abreviada en Chrome DevTools, se ve así.

fuente abreviada

Como puede ver, hay muchas otras propiedades relacionadas con la fuente que puede configurar con el comando font propiedad abreviada, pero puede ignorar cualquiera que no desee establecer.

Creo que está muy bien, pero el único inconveniente es que tienes que recordar el orden de las propiedades. Pero supongo que siempre puedes consultar los documentos de MDN si lo olvidas.

Si quieres conocer otros artículos parecidos a Hoy aprendí - Atajo de fuente CSS puedes visitar la categoría Código.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir

Esta página web utiliza cookies para analizar de forma anónima y estadística el uso que haces de la web, mejorar los contenidos y tu experiencia de navegación. Para más información accede a la Política de Cookies . Ver mas