This content originally appeared on CSS-Tricks and was authored by Chris Coyier
Louis Lazaris breaks down some bonafide CSS trickery from Jane. The Pen shows off interactivity where:
- You have to press a special combination of keys on a keyboard.
- Then type a secret password.
From there, a special message pops up on the screen. Easily JavaScript territory, but no, this is done here entirely in HTML and CSS, which is wild.
A lot of little known features and tricks is combined here to pull this off, like HTML’s accesskey and pattern attributes, as well as :not(), :placeholder-shown, and :valid in CSS—not to mention the custom property toggle trick.
That’s… wow. And yet, look how very little code it is.
To Shared Link — Permalink on CSS-Tricks
The post Detecting Specific Text Input with HTML and CSS appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.
This content originally appeared on CSS-Tricks and was authored by Chris Coyier
Chris Coyier | Sciencx (2021-11-09T22:53:45+00:00) Detecting Specific Text Input with HTML and CSS. Retrieved from https://www.scien.cx/2021/11/09/detecting-specific-text-input-with-html-and-css-2/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.