<span> не беря цвета из стиля. или таблица стилей на iPad

Question

У меня есть проблема, которая озадачивает меня часами. У меня есть следующий HTML:

<div id='numbers'><span>+44 (0)845 519 7811<br />+44 (0)118 947 4888</span></div>

Я применил следующий CSS:

#numbers span {
    color:#CCC;
}

Я проверил наследование и не вижу проблем. Этот код хорошо отображается в каждом браузере, который я тестировал, кроме Safari на iPad и iPhone, где есть цифры (я могу нажать на них, и он спрашивает, хочу ли я позвонить), однако текст белый! Я играл, изменил DIV Id, чтобы убедиться, что я не пересекаю стили, изменил диапазон color на все виды, и ничто не изменит это.

Кто-нибудь еще имел эту проблему?

(Я использую событие touchstart с Jquery, которое показывает и скрывает этот DIV при нажатии на <a>. Я упоминаю об этом, поскольку это может быть причиной проблемы, хотя я не понимаю, как.)

Answer 1

Вы можете добавить следующий метатег к заголовку HTML, но потеряете возможность щелкать телефонные номера:

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

или попробуйте:

#numbers a {
    color:#CCC;
}

Answer 2

Вместо того, чтобы вообще отключить обнаружение телефонных данных, вы всегда можете нацелить ссылки на телефонные номера и принудительно установить желаемый стиль.

a[href^="tel:"] { 
    color: #CCC !important; 
    etc... 
}

Это переопределит стиль по умолчанию Monile Safari без добавления всякой дополнительной разметки кHTML.

Answer 3

Этот вопрос содержит ваш ответ.

Проблема в том, что iOS автоматически превратит все, что похоже на номер телефона, в ссылку.Вы можете отключить эту функцию с помощью:

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

и затем явно использовать схему URI "tel", например:

<a href="tel:+44 (0)845 519 7811">+44 (0)845 519 7811</a>