当前位置: 首页 > 面试题库 >

iPhone上的字体大小呈现不一致

华阳秋
2023-03-14
问题内容

我正在测试我的网站,并且在所有浏览器上都能正常工作,但iphone浏览器(我认为它是移动Safari?)除外,该浏览器呈现的文字部分的字体比其他字体大。我已经手动检查了CSS,并在页面上使用了萤火虫,并且可以确认我对所有CSS都设置了相同的大小。我该如何解决?


问题答案:

为了稍微改善Lukasz的想法,请尝试在CSS中使用以下规则:

body {
    -webkit-text-size-adjust: 100%;
}

使用值“ 100%”而不是“ none”,使所有其他基于Webkit的浏览器在使用缩放功能时仍可以调整文本大小,同时仍保留原始字体大小。

仅在现代浏览器(例如Safari,iPhone设备的歌剧)中出现此问题。解决方法

使用 -webkit-text-size-adjust 附加此样式 :100%; 或-webkit-text-size-adjust:无
;与所需的类,它工作正常。示例:我希望仅当请求来自移动设备时才应用该条件。因此,我添加了完整的导航路径,完全可以满足我的要求。

.mobile-phone .authenticated-page.authenticated.mobile-community.mobile-document .notification .notification-dialog.content-frame 
{
    -webkit-text-size-adjust: none;
}

要么

.mobile-phone .authenticated-page.authenticated.mobile-community.mobile-document .notification .notification-dialog.content-frame {
-webkit-text-size-adjust: 100%;

两者都可以正常工作。无需为整个身体应用样式



 类似资料:
  • 问题内容: 是否有CSS或其他原因导致Safari / iPhone忽略某些字体大小设置?在我的特定网站上,iPhone上的Safari呈现了一些font- size:13px文本,大于font-size:15px文本。它可能不支持某些元素上的字体大小吗? 问题答案: Joe的回复中包含一些最佳实践,但是我认为您正在描述的问题集中在以下事实:Mobile Safari如果认为文本会变得太小,则会自

  • 问题内容: 我们的网站在移动Safari上呈现的字体大小不一致-据我们所知,只有移动Safari。这非常困扰我们。 我们使用Firebug分析了该网站,发现不正确的区域继承了正确的样式,但字体仍然以错误的大小呈现。 1)访问http://www.panabee.com。 2)搜索域名。 左侧的框显示不正确的字体大小。字体大小应与右侧的字体大小(框标题和框副本)匹配。例如,标题“ Variation

  • 我使用的是来自的fonthttp://fonts.googleapis.com/css?family=Open Sans。由于安全原因,一些客户端使用封闭环境,因此我需要使用从npm安装的本地字体。 我尝试了npm为提供的多个软件包,如,,但使用相同css的字体与以前使用GoogleApis字体呈现的字体不同,尤其是

  • 问题内容: 我有这样的CSS声明: 这里的font1是嵌入式的eot / ttf字体,但问题是该字体比其他字体要小,所以我想为此字体(font1)使用不同的字体大小(1.8em)。所有其他字体(font2,font3)保持不变。 问题是,我无法验证用户的浏览器是使用font1,font2还是font3。是否有任何CSS声明允许不同家族使用不同的字体大小? 谢谢。 问题答案: 这里 是 一个办法做到

  • 问题内容: 我正在建立一个新的WordPress主题(不知道是否相关),并且这个问题一直困扰着我。 我已经从Google Webfonts(包括CSS 部分)中加载了Roboto Slab 。在其他所有浏览器上,除了Google Chrome之外,字体都可以正常显示。当我第一次在Google Chrome浏览器中加载网站时,使用该自定义字体的文本根本不会显示(即使字体库将佐治亚州作为后备- )。当

  • 我正在使用PhantomJS进行网页截图。 我看到过其他关于@font-face问题的帖子,但我页面上的字体呈现正确。我唯一的问题是,每次截图时,字体显示与前一个截图略有不同。所以尽管他们的渲染是正确的,但他们在截图上的外观是不一致的。 我已经尝试了许多修复,大多数都是基于这样的假设,即这与页面准备好之前拍摄的截图有关,但这似乎不是问题所在。例如,我已经延迟了截图,以便字体有时间加载和呈现,但这并