在设计布局网页时 经常想要用一些比较好看的字体，比如微软雅黑，这个字体在近年来在网页设计中运用越来越平常， 然而所使用的字体也只有自己能看到 到别的机子上 又恢复了原来的宋体神马的。

经过一位高手的提点，能用CSS直接实现，查阅了部分资料 并经过测试 总结下列方法来实现网页中的自定义字体
我们很容易发现EOT字体仅仅对于IE浏览器支持 面对庞大的ＩＥ用户　ＥＯＴ字体的重要性也就不说了

对于其他浏览器由于直接支持TTF字体 就不多介绍 只是在定义样式时 注意下浏览器的兼容问题就可以了

由于各浏览器对 ‘@font-face’ 规则字体格式支持存在差异，若仅通过定义一个 ‘@font-face’ 规则，可以通过 CSS hack 的方式在IE、Firefox、Chrome、Safari、Opera中得到相同的字体效果：

<style type="text/css">

/*定义字体*/

@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"); /* 非IE */

}

/*调用部分*/

.yourFontName { font-family:" your FontName ", verdana, helvetica, sans-serif; }

</style>

<body>

<span>微软雅黑显现效果</span>

</body>

解释一下,”your FontName” 为自定义字体名字, “real Fontname”是真实字体名字, 非IE浏览器读到第一行,一看是eot字体,跟自己没关系,于是跳到第二行,读取”local”(本地)定义的字体,试图到用户机器上去找这个字体(所以一定要用真实的字体名字,这样万一用户机子上有该字体就可以省去用户一个ttf的下载),发现没有就从后面的”url”的路径去下载ttf文件了. 而IE过程相反,它读到第一行发现是eot, 但是执行以前他会去继续读后面的行,所以”local”定义非常必要,IE不认识”local”,它就晕了,只好倒回去下载eot,如果没有local定义的话,这段字体定义代码对IE是无效的.

至此跨浏览器的内嵌字体css定义就完成了.

css调用字体 没装微软雅黑，用css写@font-face让其能显示微软雅黑字体的更多相关文章

  1. 微软雅黑 在css里怎么写

    1.首先要了解css中是如何控制字体的. font:在一个声明中设置所有字体属性: font有以下几个属性: font-style:字体样式 font-variant:字体异体 font-weight ...

  2. 在没装VS2010的机器上运行VS2010开发的C++程序

    在VS2010下写了一个win32控制台应用程序,编译ok.exe,需要依赖osg相关动态库 第一次编译的是Debug版本的,直接将ok.exe和osg相关dll文件拷贝到没有安装VS2010机器上运 ...

  3. WPF [调用线程无法访问此对象，因为另一个线程拥有该对象。] 解决方案以及如何实现字体颜色的渐变

    本文说明WPF [调用线程无法访问此对象,因为另一个线程拥有该对象.] 解决方案以及如何实现字体颜色的渐变 先来看看C#中Timer的简单说明,你想必猜到实现需要用到Timer的相关知识了吧. C# ...

  4. Android中调用系统所装的软件打开文件(转)

    Android中调用系统所装的软件打开文件(转) 在应用中如何调用系统所装的软件打开一个文件,这是我们经常碰到的问题,下面是我所用到的一种方法,和大家一起分享一下! 这个是打开文件的一个方法: /** ...

  5. vue打包后js和css、图片不显示，引用的字体找不到问题

    vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...

  6. Yii2 assets注册的css样式文件没有加载

    准备引入layui.css文件的,在LayuiAssets类中已经配置了资源属性 <?php namespace frontend\assets; use yii\web\AssetBundle ...

  7. CSS样式----图文详解（二）：css属性

    主要内容 CSS的单位 字体属性 文本属性 背景属性 列表属性 盒子模型 定位属性:position.float.overflow.z-index等 导航栏的制作 鼠标的属性cursor 滤镜的介绍 ...

  8. 利用CSS预处理技术实现项目换肤功能(less css + asp.net mvc4.0 bundle)

    一.背景 在越来越重视用户体验的今天,换肤功能也慢慢被重视起来.一个web系统用户可以选择一个自己喜欢的系统主题,在用户眼里还是会多少加点分的.我们很开心的是easyui v1.3.4有自带defau ...

  9. Font Awesome矢量版，十六进制版，WPF字体使用

    我之前在博客中介绍过几个矢量图库网站,在WPF程序中,一般接触到的矢量图标资源有XAML.SVG.字体这三种格式.XAML是标准格式就不说了,SVG并不是直接支持的,不过微软提供了Expression ...

随机推荐

  1. sudo 以管理员身份运行脚本--tee方式记录脚本日志

    说明:当运行脚本时,常遇到权限不足等,可以用以上方法来以管理员权限运行 1.编辑/etc/sudoers (注意,这里使用 visudo 而不是 vi 来设置.) 2.visudo或 给与/etc/s ...

  2. 应用程序域 System.AppDomain,动态加载程序集

    一.概述 使用.NET建立的可执行程序 *.exe,并没有直接承载到进程当中,而是承载到应用程序域(AppDomain)当中.在一个进程中可以包含多个应用程序域,一个应用程序域可以装载一个可执行程序( ...

  3. Oracle LOB 大对象处理

    LOB类型列主要是用来存储大量数据的数据库字段,最大可以存储4G字节的非结构化数据. 一.LOB数据类型分类 1.按存储数据的类型分: ①字符类型:   CLOB:存储大量 单字节 字符数据.   N ...

  4. socket.gaierror: [Errno 11001] getaddrinfo failed

  5. mysql更新数据，条件为实时查询出来的数据

    --将更新条件保存到临时表里 CREATE TABLE tmp3 AS (SELECT username FROM oa_user WHERE username NOT IN (SELECT user ...

  6. Neo4j数据进行备份、还原

    一.neo4j备份方式 neo4j数据库的备份还原分为两种: offline 和 online. Offline backup - dump Dump a database into a single ...

  7. /etc/inittab

    # inittab is no longer used when using systemd. # # ADDING CONFIGURATION HERE WILL HAVE NO EFFECT ON ...

  8. 2019-2020 ICPC, NERC, Southern and Volga Russian Regional Contest

    目录 Contest Info Solutions A. Berstagram B. The Feast and the Bus C. Trip to Saint Petersburg E. The ...

  9. Codeforces 1182D Complete Mirror [树哈希]

    Codeforces 中考考完之后第一个AC,纪念一下qwq 思路 简单理解一下题之后就可以发现其实就是要求一个点,使得把它提为根之后整棵树显得非常对称. 很容易想到树哈希来判结构是否相同,而且由于只 ...

  10. ICEM rpl文件简要讲解【转载】

    转载自:http://blog.sina.com.cn/s/blog_90affd9801016xti.html 很多人问ICEM的rpl怎样录制的问题,为什么CFX调用时老是报错,这里开个帖子简单讲 ...