一部中国語のウェブページを作成しています。すべてのテキストにUTF-8エンコードを使用します。このページには、中国語と西洋文字が混在した部分が含まれています。西洋のテキストに使用するフォントには中国語の文字が含まれていないため、ユーザーのコンピューターで使用可能な中国語のフォントを使用して中国語の文字をレンダリングする必要があります)。
中国語の文字を他のテキストの真ん中に置いて、ブラウザが中国語のフォントを見つけてそれらをレンダリングすることを期待できますか(レンダリングされるフォントを気にしない場合)、または中国語のフォントを指定する必要がありますなんか?
ユーザーのブラウザに□□ではなく你好が表示されるように、中国語のテキストのフォントを指定するにはどうすればよいですか?
私のブラウザ(Firefox 56.0)では、以下の例は両方の<span>
sで中国語のテキストを正しくレンダリングします(もちろん、コンピューターに中国語のフォントがインストールされている場合)。中国語のテキストはすべて同じフォントでレンダリングされるため、中国語のグリフでフォントの名前を指定しなくても、何らかの方法でテキストで使用されているグリフを含むフォントをブラウザが見つけることができるように見えます...それがどのように機能するかわからない:|
<!doctype html>
<html lang="en-GB">
<head>
<meta charset="utf-8">
<style>
span.serif {
font-family: "serif";
}
span.courier {
font-family: "courier";
}
</style>
</head>
<body>
<span class='serif'>123, wazzup? 一二三,你好嗎?</span><br />
<span class='courier'>123, wazzup? 一二三,你好嗎?</span>
</body>
</html>
上記は私のコンピューターでこのようにレンダリングされます:
指定されたフォントに文字のグリフが含まれていない場合、ブラウザは通常 代替フォントを使用 でこの文字をレンダリングします。
(ブラウザはhaveしません、もちろん、それが正確にどのように機能するかはオペレーティングシステムに依存するかもしれません。しかし、それは本当に驚くでしょうフォールバックフォントを使用しないブラウザーがありました。CSSをサポートしていないユーザーエージェント(テキストブラウザー、フィードリーダーなど)が多数あることは言うまでもありません;それらについては、フォントを指定することさえできませんでした。はじめに)
適切なフォントが見つからない場合、「 replacement glyph 」(別名「tofu」。多くの場合、 ただし、必ずしもではない 、「□」など)が表示されます。キャラクター。
CSSで定義されているアルゴリズム:
そのため、それを処理しないユーザーエージェントを知っていなければ、心配する必要はありません。しかし、理想的には、常にlang
属性を使用します(このコンテキストでは、ブラウザに役立つ可能性があります "言語に適したフォントを選択する" フォールバックとして)。
視覚的な調和を重視する場合は、 Noto または bunt のようなフォントファミリに興味があるかもしれません。彼らはすべての言語/スクリプトをカバーしようとし、視覚的に互換性のある方法でレンダリングします(たとえば、同じ高さなど)。
你好嗎
としてコード化されます。これらのコード化された文字は、エンコードに関係なく、任意のブラウザーを表示します。