CSS中按上鏈接有陰影可以通過text-shadow屬性來實現。
a:hover { text-shadow: 1px 1px 1px rgba(0,0,0,0.5); }
這段代碼表示在鼠標滑過鏈接時給鏈接文字添加1px的向右下方的陰影,陰影透明度為0.5。
如果想要添加更多的陰影效果,可以使用逗號分隔多個陰影參數:
a:hover { text-shadow: 1px 1px 1px rgba(0,0,0,0.5), 2px 2px 2px rgba(0,0,0,0.3), 3px 3px 3px rgba(0,0,0,0.1); }
這樣可以給鏈接添加三種不同程度的陰影效果。
需要注意的是,text-shadow屬性并不是所有瀏覽器都支持,如果是對老版本瀏覽器比較注重兼容性,可以使用box-shadow屬性來實現類似的效果,如下所示:
a:hover { box-shadow: 1px 1px 1px rgba(0,0,0,0.5); }
box-shadow屬性與text-shadow屬性的使用方法基本一致,只是作用對象不同,前者作用于盒子元素而非文本元素。
上一篇mysql最新版使用教程
下一篇mysql最新教程