Как отключить выделение номера телефона браузером HTML.
В современных браузерах присутствует довольно навязчивая опция преобразующая телефонные номера в ссылки с последующим предложением вызова. Конечно иногда это бывает удобно, но в большинстве случаев такая "медвежья услуга" нарушает дизайн страницы, особенно если приходится иметь дело с различными таблицами при выводе данных на монитор. Естественно возникает вопрос: «как отключить выделение и преобразование телефонных номеров браузером».
Существуют несколько вариантов решения проблемы. В случае с мобильными устройствами всё не так плохо, можно прописать специальный мета-тег на странице и проблема зачастую будет решена. Но такой подход работает только на некоторых мобильных платформах и совершенно не подходит для полноформатных windows браузеров.
Для Safari (iPhone / IPod / IPad) и Android браузера
<meta content="telephone=no" name="format-detection" />
Для BlackBerry
<meta content="none" http-equiv="x-rim-auto-match" />
Ещё одним способом решения этой задачи является разбиение телефонного номера на части через установку малопиксельных прозрачных изображений. Но этот способ скорее напоминает костыль для верстальщика, хоть и достигает необходимого эффекта.
Самым оптимальным и простым, на мой взгляд, решением такой задачи может послужить внедрение телефонного номера в тег "input" с запретом на ввод данных. Дело в том, что при анализе страницы браузером поля input воспринимаются как поля ввода данных и не преобразуются. Остаётся только прописать стилизацию для input: высоту, отступы, размер шрифта и т.п.
<input class="phonesno" value="+7(900)123-45-67" />
.phonesno{ display: inline; font-size: 14px; vertical-align: middle; outline: none;