有時(shí)候需要做選中的效果，比如選項(xiàng)卡切換，多個(gè)不同的文本和圖片切換，往往需要用到j(luò)s，今天給大家介紹一下另一種利用i來(lái)切換簡(jiǎn)單圖片的方法，只需要用到css，那么我們看一下怎么搞吧。
大家請(qǐng)看，如上圖使我們?cè)O(shè)計(jì)圖的效果被選中的改變圖標(biāo)和文字的顏色，并添加底部邊框，這里我們正常使用js切換內(nèi)容，給他們添加點(diǎn)擊事件，通過(guò)改變數(shù)字來(lái)判斷是否選中，并給選中的添加一個(gè)claas為on的類名。
下面就到了騷操作的時(shí)候了，正常我們使用img都需要src然后引入路徑，這里我們可以在i中引入路徑，直接改變i的內(nèi)容，當(dāng)tab選項(xiàng)被選中時(shí)，也就是他的父級(jí)被賦予了on這個(gè)類名，然后我們通過(guò).on i{}來(lái)覆蓋原本i中的路徑達(dá)到切換的效果。
大家就可以看到切換效果了，與img的切換是一樣的。
關(guān)鍵詞:
開(kāi)啟了相對(duì)路徑模式，本地址是站外域名，不能轉(zhuǎn)為相對(duì)路徑（在關(guān)閉開(kāi)發(fā)者模式后不顯示這句話） "濟(jì)南建站手術(shù)移動(dòng)護(hù)理系統(tǒng)詳細(xì)流程(千佛山醫(yī)院版）")
開(kāi)啟了相對(duì)路徑模式，本地址是站外域名，不能轉(zhuǎn)為相對(duì)路徑（在關(guān)閉開(kāi)發(fā)者模式后不顯示這句話） "濟(jì)南建站手術(shù)移動(dòng)護(hù)理系統(tǒng)")
開(kāi)啟了相對(duì)路徑模式，本地址是站外域名，不能轉(zhuǎn)為相對(duì)路徑（在關(guān)閉開(kāi)發(fā)者模式后不顯示這句話） "濟(jì)南建站紅寶書智慧黨建平臺(tái)")
