Home > Developer > Web Develop
In the design of the layout of the page often want to use some good-looking fonts, such as Microsoft Ya Black, this font in recent years in the use of web design more and more common, but the use of the font can only be seen on other machines and restore the original Song of God Horse.
After a master of the point, can be directly implemented with CSS, consulted some of the data and tested to summarize the following methods to achieve the custom font in the Web page
It's easy to find out that EOT fonts are just too important for IE browsers to face the huge eot font of IE users.
For other browsers due to the direct support TTF font is not much introduced just to define the style when the browser compatibility issues to be aware of it
Because of the differences in the browser's support for the ' @font-face ' rule font format, if only by defining a ' @font-face ' rule, you can hack through CSS in IE, Firefox, Chrome, Safari, Get the same font effect in opera:
<styletype= "Text/css">/*Defining Fonts*/@font-face{font-family:"Your FontName";src:URL (/location/of/font/fontfilename.eot); /*IE*/src:local ("Real fontname"), URL (/LOCATION/OF/FONT/FONTFILENAME.TTF) format ("TrueType"); /*Non-IE*/}/*Invoke part*/. Yourfontname{font-family:"Your FontName", Verdana, Helvetica, Sans-serif; }</style><Body><span>Microsoft ya Black Show effect</span></Body>
Explain, "Your FontName" for the custom font name, "Real FontName" is the real font name, non-IE browser read the first line, a look is eot font, it does not matter, so jump to the second line, read "local" (locally) defined font, Try to go to the user machine to find this font (so be sure to use the real font name, so in case the user has the font on the device can save users a TTF download), found that the "url" from the back of the path to download TTF files. The IE process instead, it read the first line found to be eot, but the execution before he will go to continue to read the following line, so "local" definition is very necessary, ie do not know "local", it fainted, had to go back to download EOT, if there is no local definition, This font definition code is not valid for IE.
The cross-browser inline font CSS definition is complete.
CSS call font not installed Microsoft Ya black, with CSS write @font-face let it display Microsoft ya Black font
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
