首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >当用户运行Linux时,如何才能使用特定字体?

当用户运行Linux时,如何才能使用特定字体?
EN

Stack Overflow用户
提问于 2010-04-18 16:01:12
回答 4查看 6.2K关注 0票数 5

有没有办法检测使用JQuery或CSS的操作系统?对于CSS,我指的是类似于<![if !IE]>的东西。

我需要使用一个特定的字体,只有当网页是使用Linux查看,而不想包括与其他操作系统的

EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2010-04-18 16:19:59

虽然没有直接回答“检测O/S”的问题,但使用font-family CSS属性选择字体可能会达到所需的效果。

此属性允许您选择字体列表,其中浏览器将尝试匹配系统上可用的字体。它从左到右读取,并将使用第一个可用的字体:

代码语言:javascript
运行
复制
body
{
    font-family: "Calibri", "Arial", "Sans Serif"
}

在这种情况下,如果"Calibri“字体不可用,系统将使用"Arial”。如果找不到"Arial“,它将使用"Sans Serif”系列中的任何可用字体。

这样,您可以首先指定特定于Linux的字体,并知道其他没有可用字体的平台也将使用合适的字体显示。

票数 8
EN

Stack Overflow用户

发布于 2010-04-18 16:03:29

检查navigator.userAgent

你通常可以用简单的rx找到你想要的东西,但要做到这一点需要对嗅探有基本的了解。您可以找到一个很好的示例here

注意:我并不是建议您使用嗅探库,只是建议您熟悉需要查找的内容。

至于通过操作系统动态控制字体,我认为,除非你的问题中没有提到一些边缘情况,否则简单地定义一个font stack是最好的选择。

票数 14
EN

Stack Overflow用户

发布于 2011-10-26 04:28:23

我喜欢把jQuery和CSS结合起来来解决这个问题。这种方法的灵感来自现代,它动态地将浏览器的所有功能作为类添加到html元素中。

代码语言:javascript
运行
复制
// Detect Browser
$.each(jQuery.browser, function(i, val) {
  $("html").addClass( i );
  $("html").addClass( val );
});
// Detect Operating System
$("html").addClass( navigator.platform );

当我查看页面并检查DOM时,运行上述代码的结果会给出以下输出。一个问题是,我在Mac上使用Chrome,但jQuery的浏览器对象认为我使用的是Safari,这也是一个webkit浏览器。

代码语言:javascript
运行
复制
<html class="webkit version 535.1 safari MacIntel">

如果你打印javascript的navigator.useragent,你会得到一个包含大量这样的信息的结果

代码语言:javascript
运行
复制
Mozilla-5.0 (Macintosh; Intel Mac OS X 10_6_8) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.835.202 Safari/535.1

msie是分配给IE的jQuery.browser标签,所以如果我将浏览器作为类附加到html或body标记,我可以在css中执行类似的操作,而不需要条件语句:

代码语言:javascript
运行
复制
h1 { /* my regular h1 styles */ }

.msie h1 { /* IE edge case styles for h1 treatment */ }

在jQuery中,你可以使用其出色的选择器引擎来搜索版本#和各种组合,以直接针对仅适用于特定浏览器版本和操作系统组合的问题。只需输出整个userAgent字符串html类,只需确保清除移除/()字符的字符串。

http://api.jquery.com/jQuery.browser/

@Sky有一个很好的链接指向这个http://www.quirksmode.org/js/detect.html,它可以用来获得更准确的浏览器和操作系统信息,你可以将这些信息作为类附加到HTML元素中。

票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2661540

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档