网页中使用的特殊字体(webdings, wingdings 2)续
来源:互联网 发布:网上兼职淘宝真的好吗 编辑:程序博客网 时间:2024/05/21 09:43
前言
其实在上一篇
网页中使用的特殊字体(webdings, wingdings 2)
已经完成了, 但是发布之后, csdn 竟然保存出现了异常。 估计是使用了一些 unicode 的缘故。这应该也算csdn 的bug 了。
wingdings 2
不能贴表了, 直接参考
http://www.alanwood.net/demos/wingdings-2.html
开发
实际开发中, 使用的方式很简单,直接设置font- family 就可以了。
<!--Add by oscar999--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Author" CONTENT="oscar999"><script></script></HEAD><BODY><span style="color:red;font-family:webdings">n</span> <br><span style="color:red;font-family:Wingdings 2">}</span> <br></BODY></HTML>
但是以上在firefox 中不能显示。
mozilla.org建議使用 Unicode。
http://zh.wikibooks.org/w/index.php?title=Unicode%2F2000-2FFF&variant=zh-hant
使用unicode 替换就可以了。
对wingdings 2字体来说, 上面的} 显示的是一个圆圈里面一个 数字9 ,以上效果在firefox 中却不能显示,
这个图形对象的unicode 是 10110 ,使用以下方式 ❾ :
<span style="color:red;font-family:Wingdings 2">❾</span>
summary 一下:
1. webdings 在IE 和Chrome 下可以, firefox 需使用unicode
2. wingdings 2在IE下可以, 在chrome 和firefox 需使用unicode
操作系统的差别
基本上windows 系统都有安装这些字体, 所以可以通过font-faimily 直接指定,
可以到 C:\WINDOWS\Fonts 去找到这些字体的文件 后缀名是 .ttf 的。
但是在Linux系统上, 并没有这些字体。
linux 安装字体位置是: /usr/share/fonts .
所幸的是 css3 有一个导入字体文件的方式 @font-face
从windows 中把对应字体文件(.ttf) copy 处理, 放在web 项目的相应目录下, 如下使用
<!--Add by oscar999--><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Author" CONTENT="oscar999"><script></script><style>@font-face{font-family:"Wingdings 2";src:url(WINGDNG2.TTF);}</style></HEAD><BODY><span style="color:red;font-family:Wingdings 2">❾</span></BODY></HTML>
从以上可以看出,在linux 上使用firefox 上需显示特殊的字符的话,
需要
1. 导入字体文件
2. 使用unicode 方式
font-face
@font-face { font-family: DeliciousRoman; src: url('…/Delicious-Roman.otf'); font-stretch: condensed; font-style: oblique; font-weight: bold;}
并非所有的浏览器都支持@ font-face的!
目前,@ font-face的支持
- Firefox
- Opera
- Chrome
- Safari
- Internet Explorer 9
这是你会说他不支持IE9以下的浏览器吗,不用担心,在旧的浏览器使用@ font-face时,不同的浏览器支持特定的字体文件。
- IE浏览器:EOT
- Mozilla浏览器:OTF,TTF
- Safari浏览器:OTF,TTF,SVG
- 歌剧:OTF,TTF,SVG
- Chrome浏览器:TTF,SVG
Font Squirrel
Font Squirrel是一个很棒的网站,你应该非常熟悉。Font Squirrel是一家集优质商业使用的免费字体供您下载。最重要的是,他们有@ font-face的工具包部分和@ font-face的工具包生成器。Font Squirrel工具包,为您提供不同的字体类型,你需要支持的每一个浏览器。
@ font-face的工具包
Font Squirrel的套件部分是现成的工具包,其中包括多种字体格式,CSS和HTML代码的集合。所有你必须做的是选择一个字体,下载工具包,并复制代码。这是简单,。最重要的是,他们有一个很大的选择充满了巨大的字体。
- 网页中使用的特殊字体(webdings, wingdings 2)续
- 网页中使用的特殊字体(webdings, wingdings 2)
- WPS for Linux提示“系统缺失字体symbol、wingdings、wingdings 2、wingdings 3、webding”的解决方法
- WPS for Linux提示“系统缺失字体symbol、wingdings、wingdings 2、wingdings 3、webding”的解决方法
- WPS for Linux提示“系统缺失字体symbol、wingdings、wingdings 2、wingdings 3、webding”的解决方法
- ubuntu WPS 提示“系统缺失字体symbol、wingdings、wingdings 2、wingdings 3、webding”的解决方法
- ubuntu WPS 提示“系统缺失字体symbol、wingdings、wingdings 2、wingdings 3、webding”的解决方法
- webdings字体 的应用
- 在网页中使用特殊字体的几种方式
- 在网页中使用特殊字体
- webdings和wingdings字符对应
- Webdings的字体对照表
- 'Webdings' 的字体对照表
- Wingdings字体
- Wingdings字体
- Wingdings字体
- Webdings字体
- face='Webdings' 的字体对照表
- poj3278 Catch That Cow(bfs搜索)
- LeetCode - Combination Sum
- kindEditor完整认识 PHP上调用并上传图片说明
- hdu4082 Hou Yi's secret(相似三角形)
- AAAI-2013概述(1)
- 网页中使用的特殊字体(webdings, wingdings 2)续
- FATE hdu 二维费用背包
- ecshop点击订购、加入按钮没反应的解决方法
- 内存数据库Altibase的开启关闭和进入sql命令行方法
- kernel_mktime 函数详解
- 图像灰度化与二值化实例
- TextView跑马灯的两种实现
- java 串口透传功能测试demo
- g++编译连接多个文件