一 思路: 將偽元素:before和:after定位到元素底部中間,設置寬度從 變成 達到目的。 二 實現: 首先定義一個塊狀元素 行內元素沒有寬高 並修改樣式為一個背景色為淺灰色的矩形,設置相對定位。 html代碼 lt div id underline gt lt div gt css樣式 underline width: px height: px background: ddd margi ...
2017-04-20 16:57 0 3443 推薦指數:
.selectStyle { color: #EF420E; font-size: 35rpx; font-weight: bold; position: relative; ...
先來看一下效果: 1、基本效果就是這樣的 ,鼠標懸停,下划線划入。鼠標離開,下划線划出 2、下划線的划入是有方向的,從左側划入懸停,下划線由左向右伸長。從右側划入,下划線由又往左伸長 實現思路 1、導航是由ul+li組成的,在這里顯然li 的寬度是不固定 ...
...
在做頁面的時候發現頁面導航欄有一個很棒的效果。具體的效果就是,當鼠標移到一個導航欄時,導航欄下方會緩慢出現一條線。 當用ui內聯的方式實現普通的導航后,在html中的li添加一個class用來控制下划線的移動。 html部分: <div class="top"> ...
...
...