课程: HTML and CSS: Creating Navigation Bars
今天就学习课程吧!
今天就开通帐号,24,700 门业界名师课程任您挑!
Adding an icon to the link in an accessible way
课程: HTML and CSS: Creating Navigation Bars
Adding an icon to the link in an accessible way
- [Instructor] On occasion, you may wish to add icons to your navigation. These might be social media icons, or they might be icons in addition to the text in the nav bar itself, unless the icon is instantly recognizable, like social media icons, you should always have a text equivalent next to your navigation button names. In other words, where everybody can see it. Of course, you're going to have some kind of alt text for people who need an alternative to the picture. But even for people who have no disabilities, they need to have text next to your icons in your navigation. Otherwise you wind up with the dreaded mystery meat navigation, which is a term popularized by Vincent Flanders in his absolutely fantastic book called "Webpages That Suck", which was published in 1998. In our case, we are going to be working with Font Awesome today. And we're going to add two icons to our navigation. We're going to add a home icon, and we're going to add an icon for Twitter, just as you get some…
随堂练习,边学边练
下载课堂讲义。学练结合,紧跟进度,轻松巩固知识。
内容
-
-
-
-
(已锁定)
Creating space in your nav bar6 分钟 27 秒
-
(已锁定)
Enlarging the clickable area of the link4 分钟 28 秒
-
(已锁定)
Indicating "you are here" in the navigation4 分钟 7 秒
-
(已锁定)
Adding an icon to the link in an accessible way7 分钟 24 秒
-
(已锁定)
Using background images in links for styling4 分钟 6 秒
-
(已锁定)
Challenge: Style a vertical nav bar2 分钟 5 秒
-
(已锁定)
Solution: Style a vertical nav bar3 分钟 20 秒
-
(已锁定)
-
-
-
-