Weekly Platform News: CSS font-style: oblique, webhint browser extension, CSS Modules V1

This week's web development news highlights variable font styling, a new browser linting extension, and the initial release of CSS Modules.

Variable Fonts and font-style: oblique

Many popular variable fonts include 'wght' (weight) and 'slnt' (slant) axes, allowing for diverse font styles from a single file. The "Variable Web Typography" demo showcases this effectively.

Instead of using the more complex font-variation-settings property, you can now leverage font-style: oblique for slanted text in fonts with a 'slnt' axis. This simpler method is supported across Chrome, Safari, and Firefox.

<code>/* BEFORE */
h2 {
  font-variation-settings: "wght" 500, "slnt" 4;
}

/* AFTER */
h2 {
  font-weight: 500;
  font-style: oblique 4deg;
}</code>

webhint Browser Extension

The webhint linting tool is now conveniently accessible as a browser extension for Chrome, Edge, and Firefox (see Microsoft's announcement). A key advantage over Lighthouse is webhint's superior cross-browser compatibility checks.

Other Notable News

• CSS Modules V1: A new Microsoft proposal aims to integrate CSSStyleSheet imports directly into JavaScript modules, enabling syntax like import styles from "styles.css"; (via Thomas Steiner).
• Uninstalling Chrome Web Apps: Desktop Chrome users can now uninstall web apps via the about:apps page (right-click an app icon to find the "Remove..." option) (via Techdows).
• AMP and Large News Sites: Due to AMP's unique demands, major news outlets like The Guardian find maintaining two separate codebases (one for AMP, one for the regular site) to be the most efficient approach (via The Guardian).

For more detailed news and updates, check out the weekly Sunday issue at webplatform.news.

The above is the detailed content of Weekly Platform News: CSS font-style: oblique, webhint browser extension, CSS Modules V1. For more information, please follow other related articles on the PHP Chinese website!