<ul th:fragment="header-left">
<li class="person active"><a href="https://bbs.csdn.net/personal">個人中心</a></li>
<li class="person">個人資料
<ul>
<li><a href="https://bbs.csdn.net/topics/#">個人資訊</a></li>
<li><a href="https://bbs.csdn.net/topics/#">安全設定</a></li>
<li><a href="https://bbs.csdn.net/topics/#">識訓地址</a></li>
</ul>
</li>
<li class="person">我的交易
<ul>
<li><a href="https://bbs.csdn.net/myorder" data-anchor="myorder">訂單管理</a></li>
<li><a href="https://bbs.csdn.net/topics/#">退款售后</a></li>
</ul>
</li>
<li class="person">我的資產
<ul>
<li><a href="https://bbs.csdn.net/topics/#">優惠券 </a></li>
<li><a href="https://bbs.csdn.net/topics/#">紅包</a></li>
<li><a href="https://bbs.csdn.net/topics/#">賬單明細</a></li>
</ul>
</li>
<li class="person">我的小窩
<ul>
<li><a href="https://bbs.csdn.net/topics/#">收藏</a></li>
<li><a href="https://bbs.csdn.net/topics/foot.html">足跡</a></li>
<li><a href="https://bbs.csdn.net/topics/comment.html">評價</a></li>
<li><a href="https://bbs.csdn.net/topics/news.html">訊息</a></li>
</ul>
</li>
</ul>
《---使用thymeleaf模板引入上面的模塊---》
<aside class="menu">
<ul th:replace="mall/common/header/header-left :: header-left"></ul>
</aside>
現在點擊a標簽里面的鏈接,會通過請求后臺跳轉到相應的頁面,點擊的a需要改變字體顏色,比如點擊之后變紅色,每點擊一個a標簽就變紅色,
怎么實作,在鏈接里面不寫鏈接地址可以實作,一跳轉就不行了
uj5u.com熱心網友回復:
a:link{ color:#F00}/* 鏈接默認為紅色a:hover{ color:#000}/* 滑鼠懸停黑色
a:active{ color:#03F}/* 滑鼠點擊與釋放時藍色
a:visited{ color:#F0F}/* 訪問過為粉紅
uj5u.com熱心網友回復:
每個li寫一個id,如果點擊a標簽只是切換路由就匹配路由,等于li的id就給li加一個active樣式。如果是跳頁的就把點擊的id快取起來,跳頁以后匹配值等于快取id的li設定active樣式<li id="myorder"><a href="https://bbs.csdn.net/myorder" data-anchor="myorder">訂單管理</a></li>
點擊后的地址是xxx/myorder 路由跳轉直接用myorder匹配
點擊后是xxx/xxx.html
需要快取id,如果id和html名一樣也可以做匹配不需要快取
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/75493.html
標籤:HTML(CSS)
上一篇:請教這段js 代碼如何理解
