實現這個效果很簡單,我們用css的偽元素來實現,用transform的scale對偽元素進行縮放,達到動態的效果。
<
!doctype html>
"en"
>
"utf-8"
>
動態下劃線<
/title>
"text/css"
>
.super
-link
.super
-link:
:after
.super
-link:hover
.super
-link:hover:
:after
.left:
:after
.cent:
:after
.right:
:after
.color:
:after
<
/style>
<
/head>
"#"class
="super-link left"
>動態效果左向右伸展<
/a>
"#"class
="super-link center"
>動態效果中間向兩邊伸展<
/a>
"#"class
="super-link right"
>動態效果右向左伸展<
/a>
"#"class
="super-link color"
>自定義顏色<
/a>
<
/body>
<
/html>
由於本人剛接觸前端,有不足的地方請多多指教。 Python單下劃線和雙下劃線
python 用下劃線作為變數字首和字尾指定特殊變數。不能用 from moduleimport 匯入 系統定義名字 類中的私有變數名 核心風格 避免用下劃線作為變數名的開始。因為下劃線對直譯器有特殊的意義,而且是內建識別符號所使用的符號,我們建議程式設計師避免用下 劃線作為變數名的開始。一般來講,...
美化下劃線
在css中,眾所周知使用text decoration underline 可以為任何文字新增下劃線的效果。不過我們一般都在初始化裡把a標籤的下劃線去掉 text decoration none 有沒有想過美化這些下滑下劃線呢 理想的場景中,強調使用下劃線,它應該做到以下幾點 這些要求並不為過,都是...
下劃線滑動
下劃線滑動,最後乙個li空著,留著後面有用,通過絕對定位,把最後乙個 li.quebec 定位到導航下方,設定寬度高度。設定 transition,當我們改變 left,width的時候就能實現動畫。css 樣式 ul li li a selected a最後乙個li空著,留著後面有用。css樣式就...