第一次访问该网站时@font-face不会加载,必须刷新/重新加载

2024-04-17

我已经使用正确配置了 CSS 文件http://www.fontsquirrel.com/fontface/generator http://www.fontsquirrel.com/fontface/generator套件生成器和CSS代码,将字体文件上传到正确的目录中。

第一次进入刷新后,字体在我的网站上工作得很好,即使在页面之间切换时也是如此,只是第一次进入网站时字体不会显示,直到刷新页面,这在 Firefox 和 Chrome 中都会发生。

我的 CSS 文件顶部的 css 代码:

@charset "utf-8";
body { margin:0; padding:0; width:100%; background:url(images/bg.png) repeat; }
html { padding:0; margin:0; }
a { text-decoration:none; border: none; outline:none; }
a:hover { text-decoration:underline; }
a img {border: none; }

@font-face{ font-family: 'handfont-webfont'; src: url('text/handfont-webfont.eot'); src: url('text/handfont-webfont.eot?#iefix') format('embedded-opentype'), url('text/handfont-webfont.woff') format('woff'), url('text/handfont-webfont.ttf') format('truetype'), url('text/handfont-webfont.svg#webfont') format('svg'); }

这是我的页面中的段落所使用的字体代码:

.body p { font-family:handfont-webfont; font-size: 12px; padding:5px 5px; margin:0; }

我尝试寻找答案,但找不到答案,非常感谢任何帮助的人。


您是否尝试过将 @font-face 放在 CSS 中其他任何内容之前。

你的 CSS 有一个错误:

.body p { font-family:handfont-webfont;}//there are no single quotes

将其更改为:

.body p { font-family:'handfont-webfont';}//with single quotes
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

第一次访问该网站时@font-face不会加载,必须刷新/重新加载 的相关文章

  • mailto:相当于电话的链接? [复制]

    这个问题在这里已经有答案了 有没有办法使用 html 和 或 JS 链接图像以便拨打电话 类似于 mailto 链接 如果可能的话 这只会让生活变得更加轻松 假设如果一个人有 Skype 是否可以通过一个按钮为他们打开 Skype 并拨打电
  • 如何使用 javascript 触发表单验证的本机验证气泡/工具提示?

    我有一个附加了 html5 验证 必需 等 属性的表单 有没有一种方法可以触发本机验证气泡 工具提示的出现 而无需模拟表单的提交按钮上的 单击 正如评论中所述 您可以使用 reportValidity 方法 这是广泛支持 https dev
  • Bootstrap:使用单个选项卡导航控制多个选项卡面板

    我想用一个选项卡导航来控制两个不同的选项卡内容 在 Bootstrap 3 中 我有一个使用逗号分隔数据目标的解决方案 如本例所示 https stackoverflow com a 19719859 1788961 https stack
  • 将客户端生成的响应作为下载进行流式传输,无需 Service Worker

    假设我有一个在客户端生成的大文件 我希望允许用户将其保存到他们的硬盘驱动器上 通常的方法是创建一个 Blob 然后为其创建一个对象 URL const blob new Blob chunks type application exampl
  • 列表中允许 div 吗? [复制]

    这个问题在这里已经有答案了 我知道DIV inside LI是不允许的 但我最近在许多 大 网站上看到了它 例如粉碎杂志 网页设计师墙 etc 我尝试验证网站 但它们有错误 但没有任何信息DIV in LI 那么我可以在里面使用它吗LI 我
  • 将按键和焦点事件附加到 contenteditable div 内的元素

    我想附上keypress and focusoutcontenteditable 内段落的事件处理程序div 下面的代码似乎不起作用 div p Test p p Test p p Test p div p1 bind keypress f
  • 带滚动条的 HTML 画布

    我正在宽度不等的画布上绘制图表 每个画布可以有自己的滚动条吗 我尝试将所有画布放在一个 div 中并指定最大宽度 但它不起作用 是否有可能所有画布在页面上的可见宽度均为 500 像素 并且每个画布都有其滚动条来查看画布的整个宽度 谢谢 指定
  • 图像仅在 iPhone x 上拉伸

    我目前正在设计和构建一个 html 和 css 网站 遇到了一个小问题 我使用 chrome 开发工具检查了响应能力 根据手机和平板电脑的大小调整窗口大小 一切看起来都很好 然而 现在我在 iPhone X 上检查了该网站 图像全部垂直拉伸
  • Angular - Safari 无法正确显示 DOM

    我是 Angular 的新手 使用 Angular 4 我尝试通过在关联的组件类文件中设置属性来更新特定元素 但是 除非我尝试强制重新绘制网页 通过调整窗口大小等 否则页面不会更新 我打开检查器 看到 DOM 已更改 但显示与元素检查器中的
  • 渲染 TTF SDL2.0 opengl 3.1

    我正在使用 SDL2 0 并使用 半现代 opengl 3 1 我希望向我的应用程序添加文本叠加 并在应用程序中呈现 TTF 我将如何使用现代 OpenGL 来解决这个问题 编辑 根据 genpfault 的建议 我尝试使用 SDL TTF
  • 动态检测屏幕高度和屏幕宽度,以精简图像的高度和宽度

    我以前可以display a div标签仅在portrait使用下面提到的代码corrl https stackoverflow com users 15388872 corrl in this https stackoverflow co
  • jQuery - 拖动div css背景

    我希望能够在 div 内按住鼠标并移动它的背景 在谷歌上搜索了很多 没有找到我想要的 这是目标 显示的地图是要拖动的对象 http pontografico net pvt gamemap http pontografico net pvt
  • 更改文本框中一个字符的颜色 HTML/CSS [重复]

    这个问题在这里已经有答案了 我正在设计一个网站 我想问一下大家 如何通过CSS改变HTML文本框中字符串中的一个字符的颜色 示例 STACK OVER FLOW 只是 A 字母是红色的 你不能用常规方法做到这一点
  • 从 3.1 返回后加载 Rails 3(服务器)时出现问题

    Rails 完全菜鸟 我正在使用 Hartl 教程 到了第 4 章 CSS 4 1 2 一切看起来都很顺利 但遇到了一个问题 使页面上的文字看起来
  • 如何反转媒体查询中元素的顺序?

    我有两个 div 左和右 但是当屏幕小于 500px 时 左 div 成为底部 div 右 div 成为顶部 div DOM 中的第一个 div 应该显示为第二个 第二个 div 为第一个 I use display flex 然后 div
  • SVG 剪辑路径在 Safari 上不起作用

    我有一个简单的动画 从下往上填充 svg 然后淡出 填充是使用clipPath随着使用path with a stroke dasharray stroke dashoffset 问题是clipPath在 Safari 上似乎完全被忽略了
  • iframe 位置居中

    所以我找到了这段用于将内容放在中心的代码 但我的问题是它是为容器制作的 你知道如何为 iframe 制作它吗 或者你知道另一个代码吗 代码 center margin auto width 60 border 3px solid 73AD2
  • 如何使用 HTML5 Javascript Canvas 获取三个碰撞形状的交集并删除不碰撞的部分?

    我最近专门针对 KonvaJs 发布了类似的问题here https stackoverflow com questions 64603077 how can i get the intersection of three shapes c
  • CSS 字体在 Firefox 中不起作用

    我下面有这个字体代码 它在谷歌浏览器中工作正常 但在火狐浏览器中根本不起作用 为什么
  • 当td内容太宽时,表格溢出父div

    我准备了一个 JSFiddle 来解释 向你展示我的问题 http jsfiddle net nz96C http jsfiddle net nz96C 乍一看还不错 但是当我添加一些文本时 firsttd一旦使用 tds 整个宽度 整个表

随机推荐

  • 从 App.xaml.cs 导航

    我想将应用程序栏添加到我的应用程序的多个页面 因此 我将应用程序栏定义为应用程序资源 以便它可以被多个页面使用 现在 这些按钮的事件处理程序位于App这里提到的类http msdn microsoft com en us library h
  • 如何确定所选节点是 TreeView 中的子节点还是父节点?

    如何判断所选节点是子节点还是父节点TreeView控制 具体如何实现此类检查取决于您如何定义 子 和 父 节点 但每个都暴露了两个属性TreeNode提供重要信息的对象 The Nodes财产 http msdn microsoft com
  • 如何编写本地化的屏幕键盘

    我必须为我们公司的程序编写一个屏幕键盘 该程序主要用于具有触摸功能的工业PC 我们不能使用windows默认键盘 因为我们不需要键盘上的所有按键 所以我被要求用 C 编写一个自定义的 我已经找到了这个博客 http www siao2 co
  • pandas - 数据框中唯一行出现的数量

    如何计算每个唯一行的出现次数DataFrame data x1 A B A A B A A A x2 1 3 2 2 3 1 2 3 df pd DataFrame data df x1 x2 0 A 1 1 B 3 2 A 2 3 A 2
  • AWS Lambda:无法导入模块

    请原谅我 我对 Lambda 和 Node 都是新手 我正在尝试复制this https gist github com bhberson 7a2847888596e67fd69bgit 使用 AWS IoT 按钮订购披萨 我当前的代码是
  • 根据屏幕尺寸有固定方向

    我在手机上构建了一个 Android 应用程序 现在我要更新该应用程序以支持平板电脑尺寸的屏幕 特别是 Galaxy Tab 10 1 我弄清楚了整个res layout的事情 所以没关系 但是 我构建的应用程序具有固定的屏幕方向Andro
  • iPhone 平台的开源框架/项目 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在寻找适用于 iPhone 平台的开源框架 项目集合 我发现了很多好的框架和资源 例如ASIHTTP
  • 使用 appSettings 配置自定义 Serilog 接收器

    我创建了一个新的 Serilog 自定义接收器 并尝试通过 appSettings 配置它 自定义接收器名为 DiagnosticsBroadcaster 它的 LoggerSinkConfiguration 扩展是 public stat
  • 更新 WooCommerce 产品价格和库存

    我有外部 REST API 我从中构建一个如下所示的数组 arr array 1 gt array code gt 0100686 qty gt 2 price gt 65 22 2 gt array code gt 0100687 qty
  • 使用groupSVGElements后如何选择子元素

    我正在将 svg 加载到具有子元素的 Fabric 中 我使用 groupSVGElements 对它们进行分组 我需要能够选择每个子元素 这是一个 onclick 事件 允许我选择一个子对象 我把这个小提琴放在一起http jsfiddl
  • 如何从 WebAPI 中的自定义绑定器调用默认模型绑定?

    我在 WebAPI 中有一个自定义模型绑定器 它使用 Sytem Web Http ModelBinding 命名空间中的以下方法 该方法is用于为 Web API 创建自定义模型绑定程序的正确命名空间 public bool BindMo
  • 如何在 Prolog 中为变量(如字符串)分配多个值?

    今天早些时候 我寻求帮助以在序言中构建数据库以及如何通过参数搜索 有人提出了这个 您还可以向每个处理器添加术语列表 例如 processor pentium g4400 brand intel family pentium series g
  • 如何从两个不同的数组中替换 numpy 数组的元素

    对于数组 array2 np array np nan np nan np nan np nan 45 np nan 33 np nan np nan 32 np nan np nan 44 np nan 10 53 np nan 我需要按
  • Angular w/Jest:“verify()”与“expectOne()”?

    我有一个失败的测试 我不知道如何修复 我从 Jest 收到的错误消息似乎是矛盾的 问题与两个人的行为有关Angular HttpTestingController https angular io api common http testi
  • 如何获取命名空间元素的属性

    我正在解析每天从供应商那里收到的 XML 文档 它大量使用命名空间 我已将问题最小化到最小子集 我需要解析一些元素 所有这些元素都是具有特定属性的元素的子元素 我能够使用lxml etree Element findall TAG root
  • 节点守护进程不会以 process.stdin.setRawMode(true) 启动[重复]

    这个问题在这里已经有答案了 我正在运行节点服务器守护程序 但我不断遇到此错误 当我运行 bash strip 来测试应用程序时 我得到TypeError process stdin setRawMode is not a function
  • 使用无头选项时出现 ElementNotInteractableException 错误

    当我尝试运行下面的代码时出现错误 Error is ElementNotInteractableException 消息 元素不可交互 会话信息 headless chrome 83 0 4103 116 这似乎是因为chromeOptio
  • Ant 条件 - 'if' 或 'unless' 哪个先出现

    Question 如果 ant 目标同时使用if and unless 首先评估哪个 Example 先有鸡还是先有蛋
  • 我正确使用 ForEach 吗?

    我正在 firebase 中开发一个类似存在的系统 其布局如下 firebase user1 isOnline true user 2 isOnline true user3 isOnline false isOnline 布尔值是我稍后将
  • 第一次访问该网站时@font-face不会加载,必须刷新/重新加载

    我已经使用正确配置了 CSS 文件http www fontsquirrel com fontface generator http www fontsquirrel com fontface generator套件生成器和CSS代码 将字