html - Mac 上的字体和 div 位置不同(wordpress)

Question

www.oihanevalbuenaredondo.be

我用 font-family: adobe arabic 在 css 中为我的帖子标题制作了一个字体，在我的 Windows 上，标题准确地显示了它应该如何，但是，当我访问我的博客时在 Mac 上，标题只是一种无聊的基本字体，而不是“Adobe arabic”。为什么 safari 不能显示 Adob​​e Arabic 的标题？

这是在文档 style.css 中:

.entry-title {
font-family: adobe arabic;
text-align: center;
letter-spacing: 1px;
color: #7f7f7f;
font-size: 28px;
position: relative;
margin: 0 0 10px 0;
padding: 0 60px;
}

.entry-title a:hover {
color: #d9d9d9;
}

还有，我还有一个问题。如果你在 Windows 上，你将看不到它，但是我页面顶部的语言选项完全位于我的 Windows 上，但在 Mac 上，边框和下拉菜单的位置不均匀，其中之一他们更靠左。

这是我为边框设置的 CSS:

.topbar {
position: absolute;
right: 170px;
top:-8px;
font-size: 11pt;
color: #E1BDC3;
border: 1px dotted #999999;
border-radius:8px;
width: 255px;
height: 48px;
padding-top: 11px;
padding-left: 10px;
z-index: 1000;}

这是我为下拉菜单准备的内容:

.widget_polylang {
position: absolute;
top: -330px;
width: 150px;
right: 20px;
z-index: 10001;}

此代码用于定位小部件。因为下拉菜单只能通过小部件添加到我的博客中。所以我定位了小部件。

也许我在 css 中做错了什么，我不知道，我是 HTML 的初学者，这对我来说在 Windows 上工作得很好，但显然它在 Mac 上不正确。

Answer 1

首先，您应该通过 CSS 将新字体添加到您的元素中。在这里，您可以了解如何正确执行此操作:

How to add some non-standard font to a website?

我建议阅读 Javier Cadiz 的回答，因为他建议使用 .woff 格式，我认为这是最好的解决方案。