@font-face Server-side font style for client use Font conversion tool_html/css_WEB-ITnose

After the website is deployed to the server, the font is set in the css, but the client displays Songti or other default safe fonts. This is because the client does not have a corresponding font library. caused.

If you want the client to successfully display the server-side font, you can use the CSS style @font-face{} to achieve this.

Please see the code for the specific implementation method:

@font-face {
　font-family:'Rui word cloud water column';
　src:url('Rui word Cloud water column.eot');
src: url('Ruizi cloud water column.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url(' Rui word cloud water cylinder.woff') format('woff'), /* Modern Browsers */
　　url('Rui word cloud water cylinder.ttf') format('truetype'), /* Safari, Android, iOS */
 url('Ruiziyun Water Cylinder.svg# Ruiziyun Water Cylinder') format('svg'); /* Legacy iOS */
}

In this case, the client will automatically load the font style when opening the relevant web page. One thing to note here is that the font style to be loaded cannot be too large, otherwise it will take a long time to load, and there is a certain chance that the loading will fail, so it is best The font library should not be larger than 10M.

The loaded fonts should be used the same as under normal circumstances.

TTF to EOT tool download Access password: 21ce

Related information

http://www.php100.com/manual/css3_0/@font-face.shtml