Wednesday, May 9, 2007

[CSS] hideFocus Property

如何避免超連結在點選時會出現"虛線外框"呢?! 因為我的Blog裡有一些由圖片組成的"Navigation Icon"及"Navigatin Bar"...所以一當點選此類連結時,便會出現預設的"虛線外框(如下圖)",個人覺得那虛線相當的礙眼...XD,破壞整個美感!!
若你跟我有相同感受的話,那你就跟著底下作吧... :p

有底下兩種作法:
1. 針對單一超連結的作法: 加上 hidefocus="true" 屬性 (For IE only)
Example:<a href="http://www.google.com" hidefocus="true">Google</a>

2. 透過CSS的作法 (For IE & Firefox )
Example:<style>
a {noFocusLine:expression(this.onFocus=this.blur())} /* For IE, onFocus 的 F 要大寫*/
:focus {-moz-outline-style: none} /* For Firefox */
</style>

※若是使用Blogger的話,那就將方法2.的code加在</head>的上方即可 ^_^,若是別的Blog平台請自行摸索啦…

No comments: