当我在带有通过@ font-face加载的字体的画布上绘制文本时,文本无法正确显示.它根本不显示(在Chrome 13和Firefox 5中),或者字体错误(Opera 11).此类意外行为仅在第一次使用字体绘图时发生.之后一切正常.
这是标准行为还是什么?
谢谢.
PS:以下是测试用例的源代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>@font-face and <canvas></title>
<style id="css">
@font-face {
font-family: 'Press Start 2P';
src: url('fonts/PressStart2P.ttf');
}
</style>
<style>
canvas, pre {
border: 1px solid black;
padding: 0 1em;
}
</style>
</head>
<body>
<h1>@font-face and <canvas></h1>
<p>
Description: click the button several times, and you will see the problem.
The first line won't show at all, or with a wrong typeface even if it does.
<strong>If you have visited …Run Code Online (Sandbox Code Playgroud) 我正在使用Font-Awesome,但是在未加载字体文件时,图标显示为.
所以,我希望这些图标display:none不会加载文件.
@font-face {
font-family: "FontAwesome";
src: url('../font/fontawesome-webfont.eot');
src: url('../font/fontawesome-webfont.eot?#iefix') format('eot'), url('../font/fontawesome-webfont.woff') format('woff'), url('../font/fontawesome-webfont.ttf') format('truetype'), url('../font/fontawesome-webfont.svg#FontAwesome') format('svg');
font-weight: normal;
font-style: normal;
}
Run Code Online (Sandbox Code Playgroud)
我怎么知道这些文件已经加载,我终于能够显示图标了?
编辑: 我没有在页面加载(onload)时说话,因为字体可以在整个页面之前加载.
我正在使用@ font-face在我的网站中嵌入字体.首先,文本呈现为系统默认值,然后(一旦字体文件可能已加载),正确的字体稍后呈现一小段时间.有没有办法最小化/摆脱这种延迟,通过延迟页面渲染,直到字体加载或类似.
将所有css字体属性放入一个值的正确语法是什么.
body {font: 12px, arial, red}
Run Code Online (Sandbox Code Playgroud)
类似的东西,但有所有选择器和属性.
如何在html5画布上绘制Font Awesome字符(Icons Glyphs)?
如何设置绘制的角色?
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
context.font = '';
context.fillText();
</script>
Run Code Online (Sandbox Code Playgroud)
语言:lang-html
<canvas id="myCanvas" class="canvas" width="500" height="500" ></canvas>html>
<script>
var canvas = document.getElementById('myCanvas');
var context = canvas.getContext('2d');
context.font = '';
context.fillText();
</script>
Run Code Online (Sandbox Code Playgroud)
语言:lang-html
<canvas id="myCanvas" class="canvas" width="500" height="500" ></canvas>
Run Code Online (Sandbox Code Playgroud) 我在网站上有多种字体它加载速度非常慢,我有一些jquery功能,我需要在加载字体时加载它们.
我试着打电话给它
jQuery(window).load(function () {
//my_function()
});
Run Code Online (Sandbox Code Playgroud)
不工作怎么办???
在早期阶段(即创建 DOM 之后)有断点表明该段落的字体系列值是字体“Montserrat-Bold”,它是通过 @font-face css 添加的,但实际渲染的显示显示为默认字体。
在这里,一段时间后的断点表明段落元素实际上已按预期设置了样式(使用字体系列)。
我假设有一个浏览器实际渲染(或应用)字体样式的过程。有没有办法知道或检测何时发生这种情况?
css ×4
font-face ×3
javascript ×3
font-awesome ×2
fonts ×2
jquery ×2
canvas ×1
html ×1
html5 ×1
html5-canvas ×1
load ×1