技術(shù)頻道導(dǎo)航
HTML/CSS
.NET技術(shù)
IIS技術(shù)
PHP技術(shù)
Js/JQuery
Photoshop
Fireworks
服務(wù)器技術(shù)
操作系統(tǒng)
網(wǎng)站運(yùn)營(yíng)

贊助商

分類(lèi)目錄

贊助商

最新文章

搜索

怎樣去掉a標(biāo)簽點(diǎn)擊時(shí)的虛線邊框

作者:admin    時(shí)間:2017-8-25 13:16:0    瀏覽:

有的瀏覽器如Firefox,在a標(biāo)簽(鏈接)點(diǎn)擊后會(huì)留下一個(gè)虛線邊框,影響美觀,如下圖所示:

a標(biāo)簽(鏈接)點(diǎn)擊后會(huì)留下一個(gè)虛線邊框

我們?nèi)绻隺標(biāo)簽(鏈接)在點(diǎn)擊后不要留下虛線邊框,要怎么做呢?

其實(shí),我們可以從css來(lái)設(shè)置,達(dá)到要求。

css代碼如下:

a {
  outline:none;
}

execcodegetcode

代碼解釋?zhuān)oa標(biāo)簽定義一個(gè) outline:none; 的屬性,是告訴a標(biāo)簽不要外部邊框。

CSS outline 屬性

定義和用法

outline (輪廓)是繪制于元素周?chē)囊粭l線,位于邊框邊緣的外圍,可起到突出元素的作用。

注釋?zhuān)狠喞€不會(huì)占據(jù)空間,也不一定是矩形。

outline 簡(jiǎn)寫(xiě)屬性在一個(gè)聲明中設(shè)置所有的輪廓屬性。

可以按順序設(shè)置如下屬性:

  • outline-color
  • outline-style
  • outline-width

如果不設(shè)置其中的某個(gè)值,也不會(huì)出問(wèn)題,比如 outline:solid #ff0000; 也是允許的。

可能的值

描述
outline-color 規(guī)定邊框的顏色。
outline-style 規(guī)定邊框的樣式。
outline-width 規(guī)定邊框的寬度。
inherit 規(guī)定應(yīng)該從父元素繼承 outline 屬性的設(shè)置。

實(shí)例

設(shè)置 4 個(gè)邊框的樣式:

p{
  outline:#00FF00 dotted thick;
}

瀏覽器支持

所有瀏覽器都支持 outline 屬性。

注釋?zhuān)喝绻?guī)定了 !DOCTYPE,則 IE8 支持 outline 屬性。

TIY 實(shí)例

在元素周?chē)?huà)線

代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
p
{
  border:red solid thin;
  outline:#00ff00 dotted thick;
}
</style>
</head>
<body>
<p><b>注釋?zhuān)?lt;/b>只有在規(guī)定了 !DOCTYPE 時(shí),Internet Explorer 8 (以及更高版本) 才支持 outline 屬性。</p>
</body>
</html>

本例演示使用 outline 屬性在元素周?chē)?huà)一條線。

運(yùn)行結(jié)果

execcodegetcode

標(biāo)簽: css  a標(biāo)簽  
x
  • 站長(zhǎng)推薦
/* 左側(cè)顯示文章內(nèi)容目錄 */