【スタイルシート】半角と全角で異なるフォントを指定できますか？

解決済

質問者：hiro1120
質問日時：2005/02/17 13:22
回答数：6件

スタイルシートでフォントを指定しています。
半角英数はArial,全角はHG丸ゴシックM-PROを使いたいと考えています。

font familyの指定で、
Arialを最初に記載すると、全角がなぜかＭＳＰゴシックで表示されてしまいます。
HG丸ゴシックM-PROを最初に記載すると、半角英数もHG丸ゴシックM-PROで表示されてしまいます。

スタイルシートを使って、全角と半角英数のフォントを別のものに指定することはできないのでしょうか？

通報する

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

質問の本文を隠す

回答 (6件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： noname#12055
回答日時：2005/02/17 19:11

愛のことを英語で

love
といいます。


みたいに、１バイト文字に何らかの論理的意味づけを行なう。
すべての１バイト文字をでくくる。
bodyにはHG丸ゴシックM-PROを指定し
span.nanrakaにArialを指定する

これしかないのでは？

デザインが先行するHTMLは本末転倒だけど
の意味づけがしっかりしていれば許容範囲かな。

- 0
- 件

通報する

この回答へのお礼

半角の前後をfontタグで囲えば目的は達するとは思っていましたが、spanをスタイルシートで規定して呼び出すということは考えていませんでした。

手間として変わらないので微妙ではありますが（笑）、「やっぱarialイマイチ」と思った時はラクなので、こちらの方がベターですね。
ありがとうございました。

通報する

お礼日時：2005/02/18 12:24

No.6

回答者： Bo_Bo
回答日時：2005/02/18 14:32

#4 です。

訂正します。

「lang属性」をCSSで指定するには、

[属性名 |= "属性値"]

がより正しい指定方法のようです。

- 0
- 件

通報する

この回答へのお礼

わざわざ訂正していただきありがとうございます。
了解いたしました。

通報する

お礼日時：2005/02/21 13:21

No.5

回答者： steel_gray
回答日時：2005/02/18 14:24

ちょっと中途半端な回答だったようですいません。

要するに font-family:Arial HG丸ゴシックM-PRO で、
書き方はあっています。

第一候補のArialで表示できる文字はArialで、
Arialで表示できない文字は第二候補のHG丸ゴシックM-PROで表示する。
と、いうのが仕様だけど現状のブラウザは
第一候補のArialで表示できる文字はArialで
Arialで表示できない文字は第二候補ではなく、ブラウザのデフォルトフォントを適用してしまいます。
なので、#2さんのように個別にマークアップしないと無理です。

- 0
- 件

通報する

この回答へのお礼

再度のご回答ありがとうございます。
やはり個別にタグをつけないとできないということですね。了解しました。

通報する

お礼日時：2005/02/21 13:16

No.4

回答者： Bo_Bo
回答日時：2005/02/18 14:17

「lang属性」でCSSの切り分け

要素の属性値、及び、テキストの言語を指定する。(HTML4.01)
　　日本語
　　English

　　対応する「lang属性」は、「言語コードと国コード」
　　http://www.kanzaki.com/docs/html/lang.html
　　などを参照のこと。

下記のソースで実験。

<html><head><title>TEST</title>
<style type="text/css"></style>
</head><body>
日本語とEnglish。
</body></html>

----
残念ながら、Firefox, Operaで有効なCSS指定も、Internet Explorerでは
有効ではありません。結局、

.en { ... }
　：
English

に落ち着くのかな！？

【蛇足】
クライアントの環境を規定できる社内LANなどでの運用でないのなら、一般的
でないフォントを指定するのは控えた方が良いと思います。
私のコンピュータに「HG丸ゴシックM-PRO」が入ったのものは皆無です！

- 0
- 件

通報する

この回答へのお礼

うーん。やっはりspanをCSSで行うのがベストっぽいですね。

HG丸ゴシックM-PROは一般的ではなかったんですね？
自分のPCには入っていたもので一般的かと勘違いしていました。
使わない方が無難ですね。　ありがとうございました。

通報する

お礼日時：2005/02/21 13:14

No.3

回答者： steel_gray
回答日時：2005/02/17 19:16

本来のCSSでは　「英字フォント、日本語フォント」　の順で指定すると英字は英字フォント、英字フォントにない文字（日本語）は後で指定した日本語フォントで表示されることになっています。

特別に他のプロパティがあるわけではありません。
（逆の「日本語フォント、英字フォント」の順で指定した場合は、日本語フォントが英字も持っているので全て日本語フォントで表示されます。）

このようにある程度は複数のフォントの指定も有効なはずなんですが、お試しのように今のブラウザでは指定順をなぞって複数のフォントを使い分けることはしてくれないようです。

参考URL：http://www.y-adagio.com/public/standards/tr_css2 …

- 0
- 件

通報する

この回答へのお礼

リンクを貼っていただきありがとうございます。
サイトに行ってみたのですが、僕の日本語レベルが足りないのか、スタイルシートの知識不足なのか、ちんぷんかんぷんでした・・・。

＜！－－引用－－
CSS2のより充実した選択子構文を使用して，言語に応じた活字を生成することができる。例えば，単一化されて同じUnicodeコード番号となる中国語及び日本語も存在するが，両者の抽象グリフは異なる。

*:lang(ja-jp) { font: 900 14pt/16pt "Heisei Mincho W9", serif }
*:lang(zh-tw) { font: 800 14pt/16.5pt "Li Sung", serif }

これにより，一定の言語，即ち，日本語又は中国語を有する要素を選択し，適切なフォントを要求する。

－－引用－－＞

上の文章は、「*:lang(ja-jp) ～} 」をどこか(各htmlファイルの<head>にスタイルとして？)に入力すれば日本語は別フォントを指定できるということですか？

＞今のブラウザでは指定順をなぞって複数のフォントを使い分けることはしてくれないようです。

しかし、そのルールに即していないブラウザばかりなので、結局は無理なのでしょうか・・・？

それとも、「*:lang(ja-jp) ～} 」を正しい場所に記載すればちゃんと動くのでしょうか？
再質問で申し訳ありませんが、お時間のある時にお答えいただけると幸いです。

通報する

お礼日時：2005/02/18 12:31

No.1

回答者： Wizard_Zero
回答日時：2005/02/17 14:13

Wizard_Zeroと申します。

それは出来ないと思います。
仮に、スタイルシートで複数のフォントを指定したとしても、一番最初に一致したフォントが使われます。そのフォントが英字フォントの場合、全角文字はブラウザで設定されている標準フォントで表示されます。

出来るなら私も使いたい...。

- 2
- 件

通報する

この回答へのお礼

やっぱりできないんですね。残念です。

＞そのフォントが英字フォントの場合、全角文字はブラウザで設定されている標準フォントで表示されます。

なるほど、だからMS Pゴシックだったんですね。
この部分について納得できました。ありがとうございました。

＞出来るなら私も使いたい...。
このサイトで一応検索かけたのですが、同等の質問がなかったので、あまりニーズがないのかと思われます。
Wizard_Zeroさん、少数派仲間ですね！（笑）

通報する

お礼日時：2005/02/18 12:19

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！