Wie entferne ich den blauen Hyperlink-Stil von Telefonnummern in iOS?

Entfernen des blauen Zahlenstils in iOS: Umfassende Anleitung

Im Bereich der mobilen Browser wendet iPhones Mobile Safari automatisch einen blauen Hyperlink-Stil an Telefonnummern. Dies kann störend sein, wenn Zahlen im Text angezeigt werden und so als anklickbare Links erscheinen. Es stellt sich die Frage: Wie kann dieses unerwünschte Styling entfernt werden?

1. Deaktivieren der automatischen Formatierung mit dem Format-Detection-Meta-Tag

Um jegliche automatische Formatierung, einschließlich des blauen Hyperlink-Stils, wirksam zu verhindern, implementieren Sie das folgende Meta-Tag im Head-Element Ihres HTML-Dokuments:

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

Bedenken Sie, dass Sie, wenn Sie Telefonnummern auf Ihrer Seite haben, die anklickbar sein sollen, diese manuell wie folgt formatieren müssen Code:

<a href="tel:+1-555-555-5555">1-555-555-5555</a>

2. Steuern des Stils mit CSS

In Fällen, in denen das Festlegen eines Meta-Tags nicht möglich ist, kann CSS verwendet werden, um den Standardstil zu überschreiben.

Option 1: Verwendung eines Attributselektors

Dieser CSS-Attributselektor zielt auf Links mit href-Werten ab, die mit beginnen „tel“:

a[href^="tel"] {
  color: inherit;
  text-decoration: none;
  /* Additional CSS properties can be added here */
}

Option 2: Targeting auf Apple-spezifische Datenattribute

Wenn das Festlegen eines Meta-Tags keine Option ist, z. B. in HTML-E-Mail-Vorlagen , verpacken Sie Telefonnummern in Anker-Tags und richten Sie sie mithilfe des folgenden CSS gezielt an:

a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

Wenn Sie auf bestimmte Links abzielen müssen, verwenden Sie Klassenattribute für Ihre Links und aktualisieren Sie den CSS-Selektor entsprechend.

Das obige ist der detaillierte Inhalt vonWie entferne ich den blauen Hyperlink-Stil von Telefonnummern in iOS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!