使用CSS類格式化href：tel鏈接

我最近繼承了一個完全使用HTML和CSS構建的網站，並使用FTP門戶。爲了讓網站更具移動性，我試圖在他們的網站上實施點擊通話電話號碼。我已經使用了點擊呼叫的代碼是經典：使用CSS類格式化href：tel鏈接

<a href="tel:#number">#number></a>

沒有爲它提供的格式爲他們的網站的各種元素的網站主CSS文件。有一個.phonenumber類，它將電話號碼設置爲48px的大小，使字體變爲紅色，並使其變爲紅色。目前，所有的電話號碼進行編碼，像這樣：

<span class="phonenumber"> phone #</span>

然而，當我打開手機＃部分爲<a href=tel>這個格式就會消失。儘管鏈接在<span>之間，但格式似乎不適用。有沒有辦法使用CSS類來設置點擊通話鏈接的格式？或者手動設置屬性，以便該數字保留其紅色，48像素格式，同時仍然充當鏈接？現在看來我可以將它作爲鏈接或格式化。請讓我知道是否有解決辦法。

來源

2015-07-20 Sad Bones Malone

這聽起來像有默認樣式發生了'了'標籤。只需用標籤包裹您的span標籤，跨度應該覆蓋樣式。 – Lee

您可以使用Attribute Selectors到href值的開頭匹配"tel"，使用前綴比較^=：

a[href^="tel:"] { 
}

這其中href屬性與「電話開始只匹配a標籤「值：

例如：

a[href^="tel:"] { 
 
    color: red; 
 
}

<a href="http://www.google.com">Test 1</a><br /> 
 
<a href="tel:+123456">Test 2</a>

來源

2015-07-20 15:56:53 LcSalazar

從技術上講，這也適用於像這樣的東西。 – Anonymous

對不起......現在不行了 – LcSalazar

聽起來像CSS選擇電話號碼通過引用其父母，而不僅僅是跨度。有點像這樣：

#parent_container_of_span span

因此，當你改變它到一個鏈接它打破了CSS。一般來說，也可能會有一些額外的格式適用於混亂的東西。

看看你是否可以進入CSS並找到其中的造型適用於跨度的一部分，將其更改爲以下

a[href="tel"] { 
    /*styles here*/ 
}

這應該做的伎倆。

來源

2015-07-20 15:52:27 codedude

當href完全等於'tel'時，這隻會將鏈接定位。 – Anonymous

您只需定位href屬性以tel:開頭的所有元素。

a[href ^= 'tel:'] { 
    font-weight: bold; 
}

來源

2015-07-20 15:56:29 Anonymous

這就是你需要

a[href^="tel:"] 
{ 
// your desired style 
}

來源

2015-07-20 15:58:41 Kaspersky

使用CSS類格式化href：tel鏈接

回答

相關問題