Уничтожение символов Юникода для веб-браузеров с отсутствующими шрифтами

Я использую Unicode "CHECK MARK" (U + 2713) в html-документе. Я обнаружил, что в большинстве браузеров он работает нормально, но иногда я встречаю кого-то с отсутствующим шрифтом на своем ПК. Существуют ли какие-либо трюки HTML/JS для указания альтернативного символа отображения (или изображения), если шрифт отсутствует?

Ответ 1

Не существует прямого способа определить, полезен ли какой-либо конкретный символ. Все, что вы можете сделать из JavaScript, - это создать <span>, содержащий один (или несколько) целевого символа в целевом шрифте, и сравнить его ширину с другим <span>, содержащим то же количество символов, которые, как вы знаете, не будут отображаться полезно (*). Если они имеют одинаковую ширину, есть вероятность, что у вас есть загрузка ящиков или вопросительных знаков в каждом, поэтому вы можете делать такие меры резервного копирования, как добавление изображения.

Так как это довольно много досады, вы можете предпочесть просто пойти на изображение. Или вы можете попробовать использовать встраивание @font-face в современных браузерах, чтобы использовать широко известный шрифт. Поскольку, как правило, IE имеет плохую поддержку Unicode font fallback, обязательно включите шрифт EOT.

(*: вы можете попробовать персонажа, который в настоящее время не назначен и, надеюсь, останется таким, например U + 08FF, или гарантированный-недопустимый символ, например U + FFFF, хотя сомнительно, следует ли вам разрешить HTML-документ.)

Ответ 2

Это не совсем то, о чем вы просите, но это может решить вашу проблему (предполагая, что ваша цель - выводить HTML без необходимости полагаться на внешние изображения и т.д.)

Вы считали URL-адреса данных изображений (также известный как RFC2397): http://www.ietf.org/rfc/rfc2397.txt

Вместо использования:

&#x2713;

чтобы представить галочку, вы должны использовать:

<img src="data:image/gif;base64,R0lGODlhCgAKAJEAAAAAAP///////wAAACH5BAEAAAIALAAAAAAKAAoAAAISlG8AeMq5nnsiSlsj
zmpzmj0FADs="/>

Это не потребует каких-либо конкретных шрифтов Unicode с символом CHECK MARK, который будет установлен на стороне клиента, но он не будет работать в Internet Explorer 7 или ниже. (Internet Explorer 8, Firefox, Safari и т.д. Должны работать нормально)

Ответ 3

Если вы можете разработать способ дистанционной проверки наличия MS Office 2000 или новее, вы можете предположить, что MS Arial Unicode установлена ​​и, следовательно, имеет эту кодовую точку в шрифте (если у вас есть CSS Семейство шрифтов установлено на нечто вроде "Arial Unicode MS, Arial, sans-serif" ).

Я считаю, что это будет работать только в Microsoft Internet Explorer, но вы сможете обнаружить установку Word, пытаясь создать свой объект ActiveX в JavaScript:

if(new ActiveXObject("Word.Application"))
{
    window.alert("Word is installed, go ahead and use the Unicode check mark in HTML");
}
else
{
    window.alert("Word is not installed, use your image of a check mark.");
}

Но учитывая, что это действительно работает только в IE, вероятно, выйдет предупреждение о безопасности в IE8, и вам по-прежнему нужен резервный механизм для других браузеров или браузеров IE без MS Office, использование изображения все время, вероятно, является лучшим способом идти.

Ответ 4

Юникод довольно стандартный, я всегда использую unicodemap.org. Вот символ, который вы используете [link], это даст вам все коды, связанные с галочкой. Если вам нужна полная обратная совместимость, вам нужно будет использовать фактическое изображение. 1 файл изображения для галочки является более легким, чем javascript hack/plugin. Вероятно, ваша лучшая альтернатива.