sr-only?代表元素只在屏幕閱讀器中顯示：sc (screen-reader)，為殘障人士 設(shè)計(jì)，體現(xiàn)人文關(guān)懷；

這是專門(mén)為殘障人士瀏覽網(wǎng)頁(yè)設(shè)計(jì)的。

在前端開(kāi)發(fā)中，有些時(shí)候設(shè)計(jì)圖上面會(huì)出現(xiàn)僅供正常視覺(jué)用戶看的元素。比如：導(dǎo)航欄菜單當(dāng)前頁(yè)面選中高亮狀態(tài)，這些狀態(tài)只有視力正常的人才能正常使用。

而殘障人士，弱勢(shì)或盲人是很難或者根本看不出導(dǎo)航菜單高亮的。他們上網(wǎng)可能借助的是屏幕閱讀器，也就是 screen reader（sr），屏幕閱讀器需要找到能辨識(shí)的文本說(shuō)明然后“讀”出來(lái)給用戶聽(tīng)。

問(wèn)題是：一些元素，比如選中高亮狀態(tài)無(wú)法讀出。因此我們還要寫(xiě)上這些元素的文本說(shuō)明，但是又不需要展示給普通用戶看到，于是加上 sr-only 的意義就在于能保證屏幕閱讀器正確讀取且不會(huì)影響正常人的使用。

比如：導(dǎo)航欄首頁(yè)鏈接被選中高亮，我們可以這樣表示。

<li class="active">

? <a href="#">首頁(yè) <span class="sr-only">(current)</span></a>

</li>

這樣正常人看起來(lái)只有首頁(yè)兩個(gè)字，而屏幕閱讀器卻可以讀首頁(yè) current