From the course: Tailwind CSS Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Screen readers

Screen readers - CSS Tutorial

From the course: Tailwind CSS Essential Training

Start my 1-month free trial

Screen readers

- [Instructor] There's a couple of classes that let you control whether items are displayed only by screen readers and the classes are sr-only and not-sr-only. Sr-only means that an item will only show up on screen readers and not in the browser. Now this can be good for textual content that is more suitable for things that are too visual. So, if you want the screen readers to read something and you don't want necessarily people to see it. Sort of like when you watch a movie with descriptive text, which is super interesting to watch, that can give additional sort of depth of information to screen readers. Now, the opposite of it is not-sr-only, which just overrides sr-only. It's tough to visualize that one, so we'll take a look at an example. I'll hit Try It Here and you'll notice that if I make this a certain size, this extra headline will pop up, and this extra headline will normally not show up because this entire…

Contents