Device type in JS
JS
原文
Welcome to HTMLcat: small, native web tricks worth remembering.
HTML, CSS, and JavaScript can do more than we remember. Each post-it pairs one useful platform feature with a small example and the caveat that matters.
Some notes cover limited or experimental features. Check the support label, keep a fallback, and test with real browsers and assistive technology.
Hide scrollbars
CSS
Empty tags
CSS
Centering in CSS
CSS
clamp()
CSS
Smooth scrolling
CSS
JS
Scroll margin
CSS
classList.toggle()
JS
Telephone and email links
HTML
Text selection highlight
CSS
The :has() relational selector
CSS
Styling list markers with ::marker
CSS
Localized prices with Intl.NumberFormat
JS
Disable a subtree with inert
HTML
The :target pseudo-class
CSS
HTML
The translate global attribute
HTML
prefers-color-scheme
CSS
Container size queries
CSS
The dialog element
HTML
JS
Better wrapping with text-wrap
CSS
Description list alignment
HTML
CSS
Native form colors with accent-color
CSS
CSS Custom Highlight API
JS
CSS
Detect hover across input types
CSS
Transparent colors with color-mix()
CSS
Scroll snap events
JS
Sort directories by size
Bash
light-dark()
CSS
contrast-color()
CSS
Scoped CSS with @scope
CSS
:where()
CSS
Scroll-driven animations
CSS
CSS carousels
CSS
HTML
corner-shape
CSS
CSS custom functions
CSS
CSS Grid Lanes
CSS
Popover API
HTML
View Transitions API
JS
CSS
Container style queries
CSS
Exclusive accordions with details name
HTML
Control dialogs with button commands
HTML
Searchable collapsed content with hidden=until-found
HTML
No post-its found.