0

in my page i need to render some unicode symbols from the list bellow.

  1. Latin Extended-B
  2. Greek and Coptic
  3. Cyrillic
  4. Herbrew
  5. Arabic
  6. Syriac
  7. NKo
  8. Miscellaneous mathematical symbols-A

my code is as per bellow:

body
{ 
    font-family:Arial, Tahoma, sans-serif ,Cambria Math, Symbola, Quivira, STIX, Code2000, Code2001, Code2002,Arial Unicode MS; 
}

<div>
    &#x027E1; <br />
    &#x027E2; &#x027E3; &#x027E4; &#x027E5; <br />
    &#x027E6; &#x027E7; &#x027E8; &#x027E9; &#x027EA; &#x027EB; <br />
    &#x027EC; &#x027ED; &#x027EE; &#x027EF;
</div>

but some of the symbols are not getting render properly. instead of the proper symbols box type symbols are getting render. as per bellow.

enter image description here

i've installed some new fonts (as per list bellow) and restarted the system, 

Code2000(TrueType)
Code2001(TrueType)
Code2002(TrueType)
arialuni.ttf

but still the actual symbols are not getting render.

how to get full support for Unicode rendering.

pks
  • 101
  • 2
  • 16
  • Works for me, tested on IE, Chrome, Firefox (newest versions, on Win 7). Which browser(s) were you using? According to the Font Information add-on of Firefox, the fonts actually used are Arial, Cambria Math, and Symbola. – Jukka K. Korpela Aug 28 '13 at 09:56
  • Windows XP , FF(23.0.1), Chrome(29.0.1547.57 m), IE(8) – pks Aug 28 '13 at 10:35
  • i've tested it in Win 7 also. but some more char i got but not all. can u plz let me know which fonts you have in your system for Unicode support. – pks Aug 28 '13 at 11:26
  • I have all the specific fonts listed in your `font-family` list and a few more. There can however be differences: fonts may exist in different versions under the same name. I suspect that some of the fonts in your system might be broken. Some fonts contain generic placeholder glyphs in some code positions. Note that `serif` refers to whatever happens to be the default serif font in each browser. I suggest that you try first with just `font-family: Aria, Cambria Math, Symbola` to see what happens. – Jukka K. Korpela Aug 28 '13 at 12:57
  • Oops I meant `sans-serif` (which is in the list), not `serif`, but the point is the same, it maps to *some* sans-serif font according to browser settings. – Jukka K. Korpela Aug 28 '13 at 13:06
  • What browser setting you are talking about? is it Encoding->Unicode(UTF-8). if it is, then its already there. or else plz let me know what setting i need to change. – pks Aug 28 '13 at 14:06
  • Characters like U+27E2 (which Jukka's browser is getting from Symbola) are just not well-enough supported in commonly-installed fonts to use on the web. If you really *need* to support all these characters, the best you can do is use `@font-face` CSS to embed a font that supports them all. – bobince Aug 28 '13 at 15:08

3 Answers3

1

You'll need to add this into your tags

<meta charset="utf-8">
Stewartside
  • 20,378
  • 12
  • 60
  • 81
1

AFAIK, all browsers support @font-face for loading webfonts and can support any character within those fonts. As such, you should be able to display any character in any browser if you make sure you provide access to a webfont with support for those characters.

To avoid using giant fonts just to support a few special characters, you can create your own fonts with tools like the Icomoon App.

I used the Icomoon App to create the Emoji emoticon font as well as for creating custom icon fonts on a per project basis.

For more info on the use or creation of icon fonts (or other webfonts), see Create webfont with Unicode Supplementary Multilingual Plane symbols

Community
  • 1
  • 1
John Slegers
  • 45,213
  • 22
  • 199
  • 169
-1

I think you are looking for the UTF, http://www.w3schools.com/tags/ref_charactersets.asp

crank
  • 92
  • 1
  • 11