做网站设计的时候,常常会遇到想在页面上显示某一字体,但是由于网站用户电脑里没有里某有相应的字体而烦恼。一般会想到的是用图片替换文字。而今天要说的是一个让用户即使电脑里没有那种字体还能自己显示的方法。
sIFR
通过sIFR你可以任意定义WEB中的文本字体,即便是客户端浏览器未安装的字体。sIFR使用Flash渲染字体效果,可以平滑消除文本锯齿,你可以像使用用CSS控制文本一样轻松得到各种文本效果。
参考网站:
sIFR :http://www.mikeindustries.com/blog/sifr/
sIFR 3 :http://novemberborn.net/sifr3
sIFR 字体生成工具:http://www.sifrgenerator.com/wizard.html
Typeface
Typeface被以为是替换SIFR的最佳方案,相对于sIFR,Typeface少了Flash的应用,使用纯JS来嵌进相关字体,而且用法也很简单:在页面中引进相应的js文件就OK了。
<html>
<head>
<!-- 加载所有的样式先 -->
<link rel="stylesheet" type="text/css" ref="/style.css">
<!-- 再加载typeface.js 库文件和typeface.js字体文件-->
<script src="typeface-0.13.js"></script>
<script src="helvetiker_regular.typeface.js"></script>
</head>
<body>
<!-- 继续并使用CSS指定typeface.js 字体 -->
<div style="font-family: Helvetiker">文本文本...</div>
</body>
</html>
从中我们可以看出来,使用Typeface只需要着简单的几步就可以在页面中使用嵌进字体了。
typeface资源:
cufon
cufon是一个比较新的技术,是一个很好的sIFR替换方案,它的特点:被浏览器原生支持无需浏览器插件;兼容各个主流浏览器;无需配置;快速渲染大量字体。
cufon的原理:
cufon通过生成器将字体文件转化为SVG字体,再将其转换为VML文件,这对IE很重要,由于IE原生支持VML文件。最后,使用复杂的JavaScript函数将VML文件编码为JSON文件(typeface的原理与此类似)。如下图所示:
这样做有很多好处:加载一个字体文件,只需要加载一些js文件就可以;客户端无需再次手工编码;外部js文件直到加载完成才会被执行,这可以让我们实现无闪烁的干净的替换。压缩率高。相对于字体文件,可压缩掉60-80% 。
cufon的用法:cufon的用法与typeface类似,需要加载一个库文件和字体文件。而与typeface不同的是,你需要使用js初始化cufon:
<script type="text/javascript">Cufón.replace('h2', { fontFamily: 'Qlassik Medium' }); </script>
这与typeface的在样式中定义字体很不一样。
cufon资源:cufon项目、cufon演示、cufon生成器、wp-cufon 一个使用cufon的wordpress插件。
cufon和typeface.js对比:
14.0kb (压缩后) | 16.3kb (未压缩) |
Firefox 1.5+, Safari 3+, Opera 9.5+, Google Chrome 和 Internet Explorer6+ | Firefox 1.5+, Safari 2+, and Internet Explorer 6+, 最新版已经支持IE8 |
.ttf, .otf, PFB, postscript | .ttf |
font-size, font-style, font-weight, line-height, text-shadow, color | font-size, font-style, font-weight, font-stretch, letter-spacing, line-height |
尚不支持 | 尚不支持 |
从这个对比中可以看出来,两者并没有太大的不同,cufon支持更多的浏览器和字体类型,而typeface支持更多的字体样式。实际应用中貌似typeface方便一些,可以直接在样式中定义字体,而cufon则有总体文件大小方面的上风。具体用哪一个,看你自己的喜好吧。
@font-face
CSS3的@font-face属性(事实上CSS2中就已引进),到现在为止,已经有Safari、Chrome、Opera 10和Firefox 3.5支持@font-face了。IE系浏览器不支持TTF格式的字体,只支持eof格式,不过,微软官方发布了一个WEFT工具,可以将TTF转化为EOF,下载。
可以使用的样式如下:
@font-face { font-family: qianduanNet; font-style: normal; font-weight: 400; src: url("SketchRockwell.ttf"); }
.fontFace{ font-family: qianduanNet; font-size: 3.2em; letter-spacing: 1px; text-align: center; }
IE中的样式如下:
@font-face { font-family: Goudy Stout; font-style: normal; font-weight: 400; src: url(GOUDYST0.eot); }
这是目前最简单实现嵌进字体的方法。
相关推荐
在技术上,文本替换专家2.6内置的文件检索替换引擎也值得一提。这项技术确保了软件在处理替换任务时的速度优势。不论是面对小规模还是大规模的文本文件集合,软件都能在极短的时间内完成查找与替换任务,从而提高了...
《批量文本替换:BatchTextReplace5.02的深度解析》 在信息技术高速发展的今天,高效的数据处理成为了日常工作中的重要环节。"BatchTextReplace5.02_批量文本替换"正是这样一款专为批量处理文本内容而设计的实用...
在网页开发过程中,开发者可能需要批量替换页面上的某个函数名、CSS类名或者URL,这时《文本替换专家》就能大显身手,无需逐个文件手动修改,节省了大量的时间。 对于jsp文件,它是动态网页的一种编程技术,常用于...
在信息技术领域,文本处理是一项常见的任务,而高效、精准的文本替换更是其中的关键环节。UltraReplace是一款专为批量文本替换设计的工具,它提供了强大的功能,能够应对各种复杂的文本处理需求。本文将深入探讨这款...
"文本批量查找替换器"还支持多种格式的文件处理,这意味着无论是简单的文本文件(如.txt),还是富文本格式(如.rtf)、网页文件(如.html)或是编程语言的源代码文件(如.java、.py等),它都能轻松应对。...
例如,在搜索引擎优化(SEO)中,关键字是用于描述网页内容的词语,而在文本替换操作中,关键字是我们想要查找并替换的部分。 “批量替换”是此操作的核心特性。批量意味着一次处理多个文件,而不仅仅是单个文件。...
- **文档编辑**:在编辑大量文档时,如报告、论文或网页内容,如果需要更改特定词汇或格式,超文本替换能节省大量时间。 - **日志分析**:在系统日志分析中,可以通过超文本替换过滤无关信息,聚焦关键数据。 - *...
《批量文本替换工具详解及其应用》 在信息技术领域,数据处理和文本操作是日常工作中的重要环节,尤其是在处理大量文本信息时,手动操作不仅耗时,且容易出错。因此,批量文本替换工具应运而生,它能有效地帮助用户...
总结来说,这款在线文本批量替换工具在实用性上为用户提供了极大的便利,无论是在文件编码识别的准确性上还是在大规模文本替换的效率上,都体现了ASP技术的应用优势。开发者通过对ASP编程特性的深入利用,并结合文件...
批量代码替换的核心工具通常是文本编辑器或集成开发环境(IDE)的内置功能,如Visual Studio Code、Sublime Text、Atom、Notepad++等,它们提供了强大的搜索和替换功能。此外,还有一些专门的代码管理工具,如Git的`...
在网页中,这可能涉及到HTML、CSS、JavaScript等文件中的文本替换;在文件系统中,可能涵盖各种类型的文档如.txt、.docx、.xlsx等。 1. **正则表达式**:在批量替换中,正则表达式是一种强大的工具。它允许你用简洁...
标题中的“网页文字替换工具,ASP-HTML-PHP”表明这是一个与网页文本处理相关的软件或脚本,可能用于批量替换HTML、ASP或PHP文件中的特定文字。这种工具在网站维护和内容更新时非常有用,尤其是当网站有大量页面且...
在IT行业中,字符替换是一项常见的任务,特别是在处理大量文本数据时。"好用的字符替换工具" 提供了批量替换功能,使得用户能够高效地在HTML、ASP、PHP等多种文件格式内进行字符替换操作,这对于网页开发、代码优化...
在IT行业中,文本内容批量替换是一项非常实用的技术,尤其对于数据处理、文档整理以及网站维护等领域。这个"文本内容批量替换"工具显然旨在帮助用户高效地处理大量文本数据,实现快速、一致的替换操作,避免手动操作...
通过以上分析可以看出,利用JavaScript进行网页内容批量替换是一项非常实用且灵活的技术。它不仅可以帮助开发者快速修改页面内容,还可以应用于多种场景中,如实时编辑、数据展示等。掌握这些基本概念和技术细节对于...
- 谨慎处理正则表达式,避免误匹配导致意外的文本替换。 6. **扩展应用**: - **文本挖掘**:在文本挖掘和自然语言处理中,查找与替换常用于数据清洗和预处理。 - **协同编辑**:在团队协作中,统一文档风格和...
本主题聚焦于“易语言分割网页文本”这一技术,它主要涉及到网络数据获取、字符串处理以及源码编写等方面的知识。 首先,我们要理解“分割网页文本”的概念。在互联网上,网页内容通常是以HTML(超文本标记语言)的...
"完整版屏蔽和替换超文本浏览框右键.rar"这个压缩包文件显然与网页交互的定制化有关,特别是针对用户在超文本浏览框(通常是网页中的iframe或者webview)中的右键操作。下面将详细解释这个主题。 首先,"屏蔽"指的...
”进一步强调了这个工具的核心功能:不仅支持单个文本的替换,还支持一次性处理多行文本,并且对多种类型的文本文件具有广泛的兼容性。TXT文件是最常见的纯文本格式,适用于基础的文字编辑;HTML是网页的结构语言,...
总的来说,【简易网页文本编辑器】是一个结合了Web技术、文件流操作、本地存储和实时协作功能的在线工具,旨在提供一个轻量级但功能强大的文本编辑环境,满足用户在网页上的各种文字处理需求。通过不断的技术优化和...