鏈接文字上劃線、下劃線同時出現如何實現？_Div+CSS教程

　　
　　鏈接文字的上劃線、下劃線、刪除線（貫穿線）、閃爍等可以通過CSS的text-decoration屬性來實現。其屬性值與效果相對應的關系如下：


　　更具體的text-decoration介紹請參考這里。

　　學習了此屬性的一些用法，我們不難看出，鏈接文字上劃線、下劃線同時出現可以通過：text-decoration: underline overline，即可以實現了。或許你有疑問，這兩個屬性值可以同時了現嗎？答案是肯定的，是可以實現的，我們看下面的運行效果：


　　看到效果了吧，雖然我們實現了鏈接文字上劃線、下劃線同時出現。但還有很多細節我們并不滿足。一、線型單一，只是實線；二、顏色不可更改（默認的線條顏色為鏈接文字的顏色）；三、距離文字的邊距不可控制，感覺離文字太近了。

　　我們想到了更好的辦法，可以去除text-decoration屬性，給鏈接加上、下邊框線，同樣可以讓上劃線、下劃線同時出現。我們看下面的運行效果。


　　在默認情況下，塊級元素的默認寬度是父級元素的寬度，并且占據一整行的頁面空間。所以我們看上面的效果，就出現了一整行都給鏈接所占據，我們可以作一些調整，設置鏈接元素為左浮動，并設置左邊距為30px。我們來看看效果。


　　你可以改變上面的運行代碼作一些調試，多動手、多思考是學習CSS的好辦法。：）