マジレス希望

cssのフォント指定について

締切済

質問者：bgmosiete
質問日時：2017/03/28 22:38
回答数：4件

僕は今cssのフォント指定について困っていることがあります。
それは、日本語のフォントと英語のフォントをそれぞれ別のフォントを指定したいのに、出来ないという相談です。例えば、"英語のテキストにはArialを指定する" "日本語のテキストにはヒラギノ明朝ゴシックを指定する"といったことです。
例のようにする方法を教えて下さいませんか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (4件)

最新から表示
回答順に表示

No.4

回答者： debu120t
回答日時：2017/04/04 15:18

私もNo.1の方が一番シンプルでわかりやすい例だと思います。

その補足的なお話となりますが、CSSでfont-familyを指定するときには、優先したいフォント順に並べる、というルールがあります。
Arialを1番目に指定してあけば、英数はArialがあたり、日本語には（Arialには日本語を表現できないので）次に指定されているヒラギノが当たる、という具合です。

数字はなしで英語だけに当てる、となるとちょっと難しいかもですね。。。
そういう場合、あたしならJSを使って「数字だけヒラギノがあたるclassを打つ」みたいなことするかなあ。
数字だけのフォントがあればそれを用意するか、、。
とにかく面倒な気がします。

- 0
- 件

通報する

No.3

回答者： ORUKA1951
回答日時：2017/03/30 14:41

簡単なサンプル

★タブは＿に置換してあるので戻す。
★https:// はhttps：//に置換してあるので戻す。:が全角

<!doctype html>
<html lang="ja">
<head>
＿<meta charset="utf-8">
＿<title>サンプル</title>
＿<link href="https://fonts.googleapis.com/css?family=Unifrakt … rel="stylesheet">
＿<meta name="description" content="">
＿<meta name="author" content="ORUKA">
<style media="screen">

</style>
</head>
<body>
＿<header>
＿＿<h1 id="title">Your title</h1>
＿＿<nav>
＿＿＿<ul>
＿＿＿＿<li><a href="#">Some</a></li>
＿＿＿＿<li><a href="#">navigation</a></li>
＿＿＿＿<li><a href="#">links</a></li>
＿＿＿</ul>
＿＿</nav>
＿</header>
＿<section class="poem">
＿＿<h2>山野あなたの空遠く<span title="翻訳者" class="translater">上田敏</span></h2>
＿＿<p>山のあなたの空遠く<br>幸住むと人のいふ。</p>
＿＿<p>ああ、われ人と尋めゆきて、</p>
＿＿<p>涙さしぐみ、かへり来ぬ。</p>
＿＿<p>山のあなたになほ遠く</p>
＿＿<p>幸住むと人のいふ。</p>
＿</section>
＿<section lang="de" class="poem">
＿＿<p lang="ja">ご存知のカールプッセの詩ですが、英文だとこうなります。</p>
＿＿<h2>Üeber den Bergen<span class="auther">Carl Busse</span></h2>
＿＿<p>Über den Bergen,<br>
＿＿ weit zu wandern,</p>
＿＿<p>Sagen die Leute,<br>
＿＿wohnt das Glueck.</p>
＿＿<p>Ach, und ich ging im Schwarme der andern,</p>
＿＿<p>kam mit verweinten Augen zurueck.</p>
＿＿<p>Ueber den Bergen,<br>
＿＿weit weit drueben</p>
＿＿<p>Sagen die Leute, wohnt das Glueck.</p>
＿</section>
＿<section lang="en">
＿＿<h2>Over the mountains<span title="翻訳者" class="translater">Jakob Kellner</span></h2>
＿＿<p>Over the mountains,</p>
＿＿<p>far to travel, people say,</p>
＿＿<p>Happiness dwells.</p>
＿＿<p>Alas, and I went,<br>
＿＿in the crowd of the others,<br>
＿＿and returned with a tear-stained face.</p>
＿＿<p>Over the mountains,<br>
＿＿far to travel, people say,<br>
＿＿Happiness dwells. </p>
＿</section>
＿<footer>
＿＿<h3>A nice footer</h3>
＿</footer>
</body>
</html>

- 0
- 件

通報する

No.2

回答者： ORUKA1951
回答日時：2017/03/29 10:02

ちゃんとHTMLが書かれていれば、スタイルシートで言語で指定すればよいだけですよ。

lang属性を使うのが良いでしょう。abbrに対してもつかるし

- 0
- 件

通報する

No.1

回答者： izayoimizuki
回答日時：2017/03/29 06:39

font-family: 'Arial','ヒラギノ明朝ゴシック';

フォント名が正しいかはご自分で調べてください。

まあArialとヒラギノだと字体似ているから判断が難しいですが…
font-family: 'Vladimir Script','ＭＳ明朝';
位雰囲気の違う字体を組み合わせてして死してみて、目的のフォントがブラウザによって読み込まれている事を確認したうえでフォント名だけコピーして組み合わせた方が確実かもですね。