我有一个页面在桌面上看起来完全没问题,但在移动设备上看起来很糟糕。我问过一些人,他们说字体(MS PGothic)与移动设备不兼容,但是当我将其更改为Arial时,它仍然显示奇怪的符号?有没有办法解决它?
这是代码!(实时预览)
<!DOCTYPE html>
<html>
<head>
<title>☆</title>
<style>
div.main {
font-family: "ms pgothic";
line-height: 110%;
}
div.header {
font-family: "ms pgothic";
text-align: center;
line-height: 50%;
}
</style>
</head>
<body>
<div class="header">
<p><i>stay close to me, don’t go</i></p>
<p><a href="//example.com">twitter</a>
<a href="//example.com">tumblr</a>
<a href="//example.com">curiouscat</a></p>
</div>
<div class="main">
<ul>
<li>tome (toh-meh)</li>
<li>they/them, non-binary</li>
<li>18↓</li>
<li>february 8, aquarius</li>
<li>se asian</li>
<li>socal</li>
<li><a href="/example.html">personality</a></li>
</ul>
</div>
<div class="header">
<a href="/byf.html">byf</a>
<a href="/ids.html">ids</a>
<a href="/ccs.html">ccs</a>
<a href="/bl.html">blacklist</a>
<a href="/i.html">interests</a>
<a href="/f.html">favs</a>
<a href="/c.html">credit</a>
</div>
</body>
</html>
在定义font-family
时,你应该为没有第一个字体的系统提供至少一种其他字体。建议您最近一次font-family
声明serif
或sans-serif
。您可以尝试将代码更改为:
font-family: 'ms pgothic', serif;
您还应该在 HTML 的<head>
中声明charset
。例如:
<meta charset="utf-8">
移动设备不得内置字体。我在任何地方都看不到字体的链接,所以这就是为什么我猜它是内置的。尝试下载字体,然后转到 http://www.w3schools.com/css/css3_fonts.asp 并了解如何将其集成到您的网站中。如果您使用的是Windows,则只需执行[WINDOWS_BUTTON + R]并键入不带引号的"字体"。然后,搜索所需的字体,并将其复制并粘贴到桌面上,然后可以将其上传到服务器。之后,您可以按照 w3schools.com 提供的步骤进行操作。
我建议你在
中添加。字符集元将确保符号正确显示。