• ベストアンサー

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

スタイルシートでフォントを指定しています。 半角英数はArial,全角はHG丸ゴシックM-PROを使いたいと考えています。 font familyの指定で、 Arialを最初に記載すると、全角がなぜかMS Pゴシックで表示されてしまいます。 HG丸ゴシックM-PROを最初に記載すると、半角英数もHG丸ゴシックM-PROで表示されてしまいます。 スタイルシートを使って、全角と半角英数のフォントを別のものに指定することはできないのでしょうか?

  • HTML
  • 回答数6
  • ありがとう数8

質問者が選んだベストアンサー

  • ベストアンサー
noname#12055
noname#12055
回答No.2

<p>愛のことを英語で <span class="nanraka">love</span> といいます。 </p> みたいに、1バイト文字に何らかの論理的意味づけを行なう。 すべての1バイト文字を<span class="nanraka">でくくる。 bodyにはHG丸ゴシックM-PROを指定し span.nanrakaにArialを指定する これしかないのでは? デザインが先行するHTMLは本末転倒だけど <span>の意味づけがしっかりしていれば許容範囲かな。

hiro1120
質問者

お礼

半角の前後をfontタグで囲えば目的は達するとは思っていましたが、spanをスタイルシートで規定して呼び出すということは考えていませんでした。 手間として変わらないので微妙ではありますが(笑)、「やっぱarialイマイチ」と思った時はラクなので、こちらの方がベターですね。 ありがとうございました。

その他の回答 (5)

  • Bo_Bo
  • ベストアンサー率65% (97/149)
回答No.6

#4 です。訂正します。 「lang属性」をCSSで指定するには、 [属性名 |= "属性値"] がより正しい指定方法のようです。

hiro1120
質問者

お礼

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

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.5

ちょっと中途半端な回答だったようですいません。 要するに font-family:Arial HG丸ゴシックM-PRO で、 書き方はあっています。 第一候補のArialで表示できる文字はArialで、 Arialで表示できない文字は第二候補のHG丸ゴシックM-PROで表示する。 と、いうのが仕様だけど現状のブラウザは 第一候補のArialで表示できる文字はArialで Arialで表示できない文字は第二候補ではなく、ブラウザのデフォルトフォントを適用してしまいます。 なので、#2さんのように個別にマークアップしないと無理です。

hiro1120
質問者

お礼

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

  • Bo_Bo
  • ベストアンサー率65% (97/149)
回答No.4

「lang属性」でCSSの切り分け 要素の属性値、及び、テキストの言語を指定する。(HTML4.01)   <span lang="ja">日本語</span>   <span lang="en">English</span>   対応する「lang属性」は、「言語コードと国コード」   http://www.kanzaki.com/docs/html/lang.html   などを参照のこと。 下記のソースで実験。 <html><head><title>TEST</title> <style type="text/css"><!-- body { color: #000; } span[lang="en"] { color: #f00; } --></style> </head><body> <p>日本語と<span lang="en">English</span>。</p> </body></html> ---- 残念ながら、Firefox, Operaで有効なCSS指定も、Internet Explorerでは 有効ではありません。結局、 .en { ... }  : <span lang="en" class="en">English</span> に落ち着くのかな!? 【蛇足】 クライアントの環境を規定できる社内LANなどでの運用でないのなら、一般的 でないフォントを指定するのは控えた方が良いと思います。 私のコンピュータに「HG丸ゴシックM-PRO」が入ったのものは皆無です!

hiro1120
質問者

お礼

うーん。やっはりspanをCSSで行うのがベストっぽいですね。 HG丸ゴシックM-PROは一般的ではなかったんですね? 自分のPCには入っていたもので一般的かと勘違いしていました。 使わない方が無難ですね。 ありがとうございました。

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.3

本来のCSSでは 「英字フォント、日本語フォント」 の順で指定すると英字は英字フォント、英字フォントにない文字(日本語)は後で指定した日本語フォントで表示されることになっています。 特別に他のプロパティがあるわけではありません。 (逆の「日本語フォント、英字フォント」の順で指定した場合は、日本語フォントが英字も持っているので全て日本語フォントで表示されます。) このようにある程度は複数のフォントの指定も有効なはずなんですが、お試しのように今のブラウザでは指定順をなぞって複数のフォントを使い分けることはしてくれないようです。

参考URL:
http://www.y-adagio.com/public/standards/tr_css2/fonts.html#font-family-prop
hiro1120
質問者

お礼

リンクを貼っていただきありがとうございます。 サイトに行ってみたのですが、僕の日本語レベルが足りないのか、スタイルシートの知識不足なのか、ちんぷんかんぷんでした・・・。 <!--引用-- 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) ~} 」を正しい場所に記載すればちゃんと動くのでしょうか? 再質問で申し訳ありませんが、お時間のある時にお答えいただけると幸いです。

回答No.1

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

hiro1120
質問者

お礼

やっぱりできないんですね。残念です。 >そのフォントが英字フォントの場合、全角文字はブラウザで設定されている標準フォントで表示されます。 なるほど、だからMS Pゴシックだったんですね。 この部分について納得できました。ありがとうございました。 >出来るなら私も使いたい...。 このサイトで一応検索かけたのですが、同等の質問がなかったので、あまりニーズがないのかと思われます。 Wizard_Zeroさん、少数派仲間ですね!(笑)

関連するQ&A

  • IEでフォントを指定しているのに半角では…

     Internet Explorer6.0を利用しているのですが、DF極太明朝体や特太ゴシックを用いて文字を表示させる場合、全角では正しくそのフォントで表示をするのですが、半角の英数がまったく違うフォントで表示されます。  これって、どこかに設定があるのでしょうか?  ご存知の方、よろしくお願いします。

  • エクセルで使用できるフォントについて

    私はwin98にオフィス2000を使用しています。 他の端末はwin2000にオフィス2000を使用しています。 私の端末で、excelシートを作成しました。 フォントは"HG丸ゴシックM-PRO"です このシートをWIN2000のオフィス2000で開こうとしたら、 指定のフォントで表示されません。 おそらく、MSゴシックあたりで表示されていると思います。 ですが、フォントの選択欄には"HG丸ゴシックM-PRO"と表示されています。 フォントを再選択しようとすると、"HG丸ゴシックM-PRO"が選択肢にありません。 オフィス2000をインストールするときにフォントの選択なんてなかった気がしますが、原因および対策方法はありますでしょうか? オフィスは共に"OFFICE2000 PREMIUM SR-1です"

  • フォントの半角・全角について

    フォントの半角・全角について、もしご存知のかたがいらっしゃいませいたら、どうぞお教えください。 Word2000、IME2000で文章を作成する際、等幅フォント(MS-ゴシック)を使っております。 このとき、全角の数字を10個並べた場合は 半角の数字を20個並べたときと同じ幅になると思っていたのですが、 行の右端で、やはり半角数字が少しはみ出てしまいます。 これは、文字と文字の間の空白の関係で仕方ないことなのでしょうか? 以前、ワープロを使っていた際には、 半角といえば全角の文字の幅のきっちり半分だったのですが、 パソコンの場合はこれは不可能なのでしょうか? また、数字に関して、「半角」「全角」という表現はおかしいのでしょうか。 「直接入力」と「全角」という表現が適切なのでしょうか。

  • スタイルシートのFont指定

    スタイルシートのフォント指定でPCにインストールされていないフォントを指定しても PCにフォントが入っていない人が見たら表示されるんでしょうか? それとも、類似するフォントに変換されてしまうんでしょうか? 教えて下さい。

  • WORD フォントの変更

    WORD(2010)で一部だけのフォントを規定に設定することはできるのでしょうか? 具体的には英数で普段HG丸ゴシックM-PROを使っていて、’だけCenturyにしたいのですが。(’の幅が広く半角にしても変わらないためです。幅を狭くできればフォント自体を変えなくてもいいのですが..) よろしくお願い致します。

  • 文書での全角・半角の使い分けの基準について

    業務で利用している資料やドキュメントの作成時に、 これらのフォントや全角・半角を統一したいのです。 文書によりまちまちなので、 とても読みづらいと感じています。 できれば、カタカナを全て全角、アルファベットや 数字は全て半角にしたいと考えています。 (仕様上、全角・半角で表記する必要のあるものなどは 変える必要はないと思いますが・・・) そこで、皆様の職場では、どのようにされているか 教えて頂きたいと思います。 1) カタカナの全角・半角 2) 英字(アルファベット)の全角・半角 3) 数字の全角・半角 4) フォントの種類について (Arial、MS Pゴシックなど) これらをどのように使い分けていますか? また、統一されたりしていますか? 宜しくお願い致します。

  • WORD98で半角英字のフォントがMS明朝にできない

    WORD98を使用しておりますが、半角の英数字でフォントにMS明朝やMSゴシックを指定しても、見た目上(印刷結果も)Centuryのままで変わりません。 全角では、指定したフォントに変わります。また、Arialなどの英字系?のフォントには変更できるようです。 以前、WORD2000(Office2000-STD)がインストールされていたのをアンインストールしてWORD98(Office97-PRO)をインストールしたことに関係があるのでしょうか? 解決方法がありましたら教えてください。よろしくお願いいたします。 (OSはWindows2000です。)

  • Outlookメール作成時の半角英数字のフォント設定について

    Office Outlook 2003を使用しており、メール作成は、テキスト形式としています。 全角の場合はゴシックフォントが適用されるのですが、半角英数字を使うと、 強制的にArialフォントとなってしまいます。とても見にくいので、半角英数字も ゴシックフォント適用されるように設定したいのですが、どうしたら良いのかが わかりません。 尚、リッチテキスト形式にしても同じです。最後に全てをゴシックに直すことは 可能なのですが、本文を打っている際には自動的に半角英数字フォントが Arialフォントに切り替わってしまいます。 設定方法をご存知の方がいらしたら、教えていただけると幸いです。 どうぞ宜しくお願い致します。

  • スタイルシート font-familyについて

    ブログのスタイルシートをいじっているのですが、ブログの記事名、ブログ本文のフォントをComic Sans MSにしたいと思っています。 それでフォント名をComic Sans MSに指定するのですが、反映されません。 また、試しにHGP行書体にすると、きちんと反映されました。 他の「カテゴリー」「コメント」等、サイドメニューの書体はちゃんとComic Sans MSに変わります。 どうすれば、Comic Sans MSになるのでしょうか。 初心者なので、どこが間違っているのかが分かりません。 下は私の作っているスタイルシートです。 div.article_subject { color: #000000; font-size: 22px; font-weight: bold; font-family: Comic Sans MS,"MS Pゴシック",Arial,Helvetica,sans-serif; } よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • IE6で、一部のサイトで半角英数字のフォントがおかしくなります

    WindowsXP Pro SP2で、Internet Explorer 6を使っています。 理由はよく分かりませんが、特定のサイトのフォーム部分に半角英数字を入力すると、いつもフォントがおかしくなります。覚えているサイトでは、例えばGoogleなどです。 全角文字はおかしくなりませんが、半角英数字を入力すると、急に変なフォントになってしまって気持ちが悪いです。調べてみると、Arial Unicode MSというのと似ているような感じのフォントです。「@」(アットマーク)などが異様に大きいのですぐに気付きます。 同じページを他のブラウザで見て試してみると普通のフォントでした。IEだけがおかしいようです。 現在のIEの設定は、フォントのところで言語セットが日本語で、WebページフォントがMS Pゴシック、テキスト形式フォントがMS ゴシックです。言語→言語の優先順位のところは日本語だけです。 あと関係ありそうなこととしては、IEのユーザースタイルシートでテキストエリアのフォントをMS Pゴシックにしています。 IE6でGoogleなどのテキストボックスに英数字を入力するとフォントが変わってしまうのは仕様なんでしょうか? もし設定が悪いとすれば、どうすれば変わらないようにできるんでしょうか? よろしくお願いします。

専門家に質問してみよう