Il numero di telefono non viene visualizzato in Safari su iOS

Question

Ho una pagina html che ha un testo seguente:

<font face="Tahoma, Geneva, sans-serif">Please contact our sales person by email: salesperson@company.com or by phone: 888-888-8888</font> 

Mostrano bene in tutti i browser tranne Safari su iOS. Il numero è lì, perché è possibile fare clic su di esso, e il dispositivo iOS ti chiede di chiamare questo numero. Non è solo visibile.

Una delle soluzioni che ho trovato è quello di aggiungere la seguente riga di codice alla testa della pagina:

<meta name="format-detection" content="telephone=no" /> 

Il numero diventa visibile, ma Safari non lo riconosce come un numero di telefono più, quindi l'utente non può fare un tocco per chiamare.

L'altra soluzione è quella di rendere il numero di telefono un link:

<a href="tel:888-888-8888" style="color:#000">888-888-8888</a> 

Ma in questo caso Internet Explorer in realtà cerca di andare al "tel: 888-888-8888" di collegamento, quindi non è il la migliore soluzione a tutti.

Quindi la domanda è: è possibile mantenere il numero di telefono come testo, ma renderlo visibile e riconoscibile come un numero di telefono in safari su dispositivi iOS?

Ulteriori informazioni:

Font è bianco perché è specificato nel file CSS per i collegamenti. Non voglio cambiarlo, perché questo influenzerà tutti gli altri link, che suppongo siano bianchi. È solo il safari su iOS che crea un collegamento ipertestuale dal numero di telefono.

Answer 1

tenta di creare classe separata di link che è la stessa come l'originale e fare ogni link nel codice il link di quella classe. Lascia il numero di telefono come testo normale. Dovrebbe funzionare.

Answer 2

Il font tag è obsoleto e non deve essere utilizzato. E 'stato deprecato in HTML 4.01 e non è completamente supportato in HTML 5.

Se si applica lo stile del testo tramite CSS, dovrebbe apparire in Safari mobile.

Invece di:

<font face="Tahoma, Geneva, sans-serif">Please contact our sales person by email: salesperson@company.com or by phone: 888-888-8888</font> 

Prova:

<span style="font-family: Tahoma, Geneva, sans-serif;"> 
     Please contact our sales person by email: salesperson@company.com or by phone: 888-888-8888 
</span> 

Idealmente, devi utilizzare i fogli di stile per specificare la presentazione della pagina, ma se si desidera solo una soluzione drop-in, che dovrebbe lavoro. Write valid html, tuttavia, e non ti imbatterai in questo tipo di problema.

Answer 3

Questa soluzione ha lavorato per me

a[href^=tel] { 
    color: inherit; 
    text-decoration: none; 
} 

ho trovato qui. https://css-tricks.com/forums/topic/phone-numbers-not-displaying-in-safari/

Sembra si tratta di un problema css strano con il modo in cui offerte di safari con i numeri.

Answer 4

Sembra IOS si accende il numero di telefono in un ancoraggio, anche se non è in un ancoraggio. Dagli una classe o un ID e poi disegna lo stile di ancoraggio.

.contact { } 
.contact a { text-decoration: none; color: #000000; } 

Answer 5

<meta name = "format-detection" content = "telephone=no">

Imposta questa nell'intestazione di spegnere il rilevamento numero di telefono nella pagina web.

Fonte: https://developer.apple.com/library/content/featuredarticles/iPhoneURLScheme_Reference/PhoneLinks/PhoneLinks.html#//apple_ref/doc/uid/TP40007899-CH6-SW1