javascript - 鼠標hover顯示紅色邊框這種效果怎么實現
問題描述
誰做過這種效果這是我寫的，使用border-right:1px solid #eee;border-bottom:1px solid #eee；鼠標懸浮時ul li:hover{border-color:#ed9639;}怎么讓左邊也有一像素紅框
問題解答
回答1：看起來好像每個項題主都只有右邊跟下邊？
我感覺改成每個項都有左邊跟下邊，hover的時候再通過設置相鄰元素的左邊顏色如何？
示例：
*{ box-sizing:border-box;}.wrap{ width:300px; }.item{ width:75px; float:left; text-align:center; border:1px solid #eee; border-right-width:0;}.item:last-child{ border-right-width:1px;}.item:hover{ border-left-color:red; border-bottom-color:yellow;}.item:hover + .item{ border-left:1px solid yellow;}.item:last-child:hover{ border-right:1px solid yellow;}
<p class='wrap'> <p class='item'>hello </p> <p class='item'>hello </p> <p class='item'>hello </p> <p class='item'>hello </p></p>
http://runjs.cn/detail/ibxy9qab
回答2：ul li:hover{ border: 1px solid #ed9639;}回答3：
box-shadow
回答4：是不是被左邊的li擋住了的？最左邊的有紅邊么？
回答5：border-left不行嗎？
回答6：是不是你的選擇器 權值太小被覆蓋了
回答7：hover 的時候 要設置z-index。高于其它層級，這樣你的邊框才不會被覆蓋
回答8：感謝大家的回答，我已經找到解決辦法，分享給大家http://www.jb51.net/css/14548...
相關文章：
1. 求：阿里云服務器windows+小皮(phpstudy)+laravel部署方案（教程）2. javascript - 一排三個框，各個框的間距是15px,距離外面的白框間距也是15px，這個css怎么寫？3. html - 急求，能否用flex或者高端點的CSS來布局這個圖呢？不想用浮動或定位了4. mysql函數unix_timestamp如何處理1970.1.1以前的數據?5. javascript - vue-cli 發布之后，如何在接口地址中去掉在開發環境中設置的跨域proxyTable配置6. java - 關于使用POI解析excel中的時間格的值7. 請問永久和臨時重定向有什么區別8. java servlet后臺導出上萬條數據到excel，太慢！求解9. css3 - rem布局下，用戶瀏覽器的最小字號是12px怎么辦？10. 怎樣使留言的數據與登錄的用戶名，密碼保持一致（在數據庫上是一行的）。
網公網安備