- ベストアンサー
CSS／日本語のID・クラス名について
CSSに、日本語のID・クラス名をつけてもよいのでしょうか？ ネットを検索したところ、 「CSS2からクラス名に日本語が利用可能。但し、IDは日本語不可」 との記述がありました。 本当でしょうか？ 誰か詳しい方、教えてください。 ▼補足 自分の環境(WindowsIE8)では、クラス名に日本語を利用しても、正常表示されました。しかし、違う環境で不具合がないかや、そもそも推奨されている手法なのかどうかについて、是非知りたいと考えています。 W3C等に準拠しているかどうか、教えてください。
- みんなの回答 （6）
- 専門家の回答
質問者が選んだベストアンサー
#5の続き。 ■XHTML1.0仕様 ▼class属性値 BaseCharで定義されている文字を使用できます。 ----- (「邦訳：Modularization of XHTML」より) 5.1. 属性集合 (Attribute Collections) 集合名 : 集合に含まれる属性 Core : class (NMTOKENS), id (ID), title (CDATA) http://msugai.fc2web.com/web/W3C/XHTMLMOD/abstract_modules.html#s_core_collection ----- ↓ XML1.0仕様書へ ↓ ----- (「XML 1.0」より) 3.3.1 属性型 ... | 'NMTOKENS' [ VC: 名前トークン ] ... 妥当性制約: 名前トークン NMTOKEN 型の値は Nmtoken 生成規則に合しなければならず、NMTOKENS 型の値は Nmtokens に合致しなければならない。 http://www.doraneko.org/xml/xml10/19980210/Overview.html#sec-attribute-types ----- ↓ ----- [8] Nmtokens ::= Nmtoken (S Nmtoken)* http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-Nmtokens ----- ↓ ----- [7] Nmtoken ::= (NameChar)+ http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-Nmtoken ----- ↓ ----- [4] NameChar ::= Letter | Digit | '.' | '-' | '_' | ':' | CombiningChar | Extender http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-NameChar ----- ↓ ----- [84] Letter ::= BaseChar | Ideographic http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-Letter ↓ ----- [85] BaseChar ::= [#x0041-#x005A] | [#x0061-#x007A] | [#x00C0-#x00D6] | [#x00D8-#x00F6] | [#x00F8-#x00FF] | [#x0100-#x0131] | ...(中略)... [#x3105-#x312C] | [#xAC00-#xD7A3] http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-BaseChar -----
その他の回答 (5)
- think49
- ベストアンサー率59% (285/482)
#4の続き。 ■XHTML1.0仕様 ▼id属性値 BaseCharで定義されている文字を使用できます。 ----- (「XHTML 1.0: 拡張可能ハイパーテキストマークアップ言語」より) C.8 フラグメント識別子 ... さらに、ID 型の属性の合法的な値のセットは、CDATA 型のものよりも遙かに小さいから、name 属性の型は NMTOKEN に変更されている。 この属性は、ID 型か、XML 1.0 第2節第5項の生成規則5にある Name 生成規則かと同じ値しかとれないよう制約されている。 残念ながら、この制約は XHTML 1.0 DTD の中に表記することができない。 この変更のせいで、既存のHTML文書を変換するときには注意を払わなければならない。 これらの属性の値は、文書内部で一意的であり、妥当でなければならず、もしも変換の間に値が変更される場合には、これらのフラグメント識別子(内部てきなものも外部的なものも)への参照はどれも更新されなければならない。 http://www.doraneko.org/webauth/xhtml10/20000126/Overview.html#guidelines ----- ↓ XML1.0仕様書へ ↓ ----- (「XML 1.0」より) 妥当性制約: ID ID 型の値は Name 生成規則に合致しなければならない。 1つの名前がXML文書内に2回以上この型の値として現れてはならない。 すなわち、ID値は、それをもつ要素を一意的に識別しなければならないのである。 http://www.doraneko.org/xml/xml10/19980210/Overview.html#id ----- ↓ ----- [5] Name ::= (Letter | '_' | ':') (NameChar)* http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-Name ----- ↓ ----- [84] Letter ::= BaseChar | Ideographic http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-Letter ----- ↓ ----- [85] BaseChar ::= [#x0041-#x005A] | [#x0061-#x007A] | [#x00C0-#x00D6] | [#x00D8-#x00F6] | [#x00F8-#x00FF] | [#x0100-#x0131] | ...(中略)... [#x3105-#x312C] | [#xAC00-#xD7A3] http://www.doraneko.org/xml/xml10/19980210/Overview.html#NT-BaseChar -----
- think49
- ベストアンサー率59% (285/482)
#3です。 > 「W3C」＝「CSS2」と思っていたのですが、「W3C」と「CSS2」って別物なのでしょうか？ W3Cは「WWWで利用される技術の標準化をすすめる団体」であり、CSS2策定にも関与していますが、「W3C = CSS2」ではないですね…。 W3Cはただの団体でCSS2仕様は別にあります。HTML4.01やXHTML1.0も別に定義されています。 W3Cとは 【WWW Consortium】 (World Wide Web Consortium) - 意味/解説/説明/定義 ： IT用語辞典 http://e-words.jp/w/W3C.html ■HTML4.01仕様 id属性値は日本語を扱えず、class属性値は日本語を扱えます。 id属性値は "&;" を許可していないので、実体参照、数値参照も使えません。 ----- id属性値 (「HTML 4.01 Specification」より) IDトークンとNAMEトークンは、アルファベット([A-Za-z])で開始し、任意の数のアルファベット、数字、([0-9])、ハイフン(-)、アンダースコア(_)、コロン、(:)、ピリオド(.)のみで記述する必要がある。 http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/types.html#type-name ----- ----- class属性値 (「HTML 4.01 Specification」より) CDATAは、文書文字集合中の任意の文字の列であり、文字実体をも含む。ユーザエージェントは、この属性値を次のように解釈する必要がある。 * 文字実体は文字で置き換える。 * 改行文字LFは無視する。 * 個々の改行文字CRあるいはタブ文字は、1つの空白文字で置き換える。 http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/types.html#type-cdata ----- (収まりきらないので、次の記事に続きを書きます)
- think49
- ベストアンサー率59% (285/482)
CSS2に限定するならば、エスケープすれば日本語も扱えます。 http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/syndata.html#value-def-identifier <style type="text/css"> /* テストですよ */ #\30C6\30B9\30C8\3067\3059\3088{ color: red; } /* テストしてみましょう */ .\30C6\30B9\30C8\3057\3066\307F\307E\3057\3087\3046{ color: green; } </style> </head> <body> <p id="テストですよ">テストですよ</p> <p class="テストしてみましょう">テストしてみましょう</p> ただ、「HTML4.01 や XHTML1.0 でid属性値、class属性値に日本語を使えるか」っていうのは別の話なので、それもクリアする必要があるでしょうね。 仕様書を確認しましょう。 HTML 4.01 Specification (ja) http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/cover.html XHTML 1.0: 拡張可能ハイパーテキストマークアップ言語 http://www.doraneko.org/webauth/xhtml10/20000126/Overview.html 掲示板/スタイルシート質問板/２行をまとめたセル内の上に文字を配置したい - TAG index Webサイト http://www.tagindex.com/cgi-lib/q3bbs/patio.cgi?mode=view&no=1298
補足
>CSS2に限定するならば、エスケープすれば日本語も扱えます。 検証ありがとうございます！ >ただ、「HTML4.01 や XHTML1.0 でid属性値、class属性値に日本語を使えるか」っていうのは別の話なので、それもクリアする必要があるでしょうね。 「W3C」＝「CSS2」と思っていたのですが、「W3C」と「CSS2」って別物なのでしょうか？ ▼W3CがCSS2のワーキング・ドラフトを公開 http://internet.watch.impress.co.jp/www/article/971105/css.htm HTML 4.01 Specification (ja) ▼http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/struct/global.html#h-7.5.2 確認してみたのですが、日本語表記不可との記述は見当たらないのですが… XHTML 1.0: 拡張可能ハイパーテキストマークアップ言語 ▼http://www.doraneko.org/webauth/xhtml10/20000126/Overview.html こちらについても、日本語表記不可との記述は見当たらないのですが… ▼掲示板/スタイルシート質問板/２行をまとめたセル内の上に文字を配置したい - TAG index Webサイト XHTML のみ ID に日本語文字使用可ということでしょうか？
- ORUKA1951
- ベストアンサー率45% (5062/11036)
＞ネットを検索したところ、 まず、仕様書を確認すること。正しい物を知りたければね。 ★まず、そのHTMLが何で書かれているかによって答えは違います。★ IDは、 HTML4.01より前は アルファベットから始まる 英数字と-.からなる。 HTML4.01以降は _と:が使えるようになった。 XHTMLは、 ・英字または_ から始まり ・英数字と-と.と_で記述 :は使えない ・重要 xmlから始めてはならない class名については調べていませんが、特に制限はなかったと記憶していますが、使わないほうがよいと思っています。
補足
＞まず、仕様書を確認すること。正しい物を知りたければね。 どの仕様書を読めばよいのでしょうか？ ▼W3C - W3Cの仕様書等の文書の日本語訳集 http://www.w3.org/Consortium/Translation/Japanese ＞★まず、そのHTMLが何で書かれているかによって答えは違います。★ 「Strict」か「Transitional」等によって、異なるということでしょうか？ IDは、 ＞HTML4.01より前は ＞ アルファベットから始まる ＞ 英数字と-.からなる。 ＞HTML4.01以降は ＞ _と:が使えるようになった。 ＞XHTMLは、 ＞・英字または_ から始まり ＞・英数字と-と.と_で記述 :は使えない ＞・重要 xmlから始めてはならない つまり、日本語表記は、ダメということでしょうか？ ＞class名については調べていませんが、特に制限はなかったと記憶していますが、使わないほうがよいと思っています。 何となく使わないほうがよいとは私も思っているのですが、 諸事情により、使えるかどうか知りたく、質問してみました…。
- stpopo
- ベストアンサー率52% (13/25)
こんにちわ 「CSS Validation Service」で検証してみたらわかることですが、 ID,classとも、エラーがでましたので、準拠されていないんじゃないでしょうか。。 ブラウザでも検証しましたが、下記のとおりOperaしかちゃんと認識されませんでした。 （テストはローカルのみ） -------------------------------- IE7 × Chrome4 × Firefox3.6 × Opera9.6 ○ -------------------------------- ●CSS Validation Service W3Cによって運営されており、 CSSをチェックするのに使うことができます。 このツールは、 CSS 仕様と比較するだけでなく、エラーや、CSS の誤用等を発見したり、自分の書いたCSS が使い勝手を悪くするような場合に教えてくれたりします。
補足
>「CSS Validation Service」で検証してみたらわかることですが、 >ID,classとも、エラーがでましたので、準拠されていないんじゃないでしょうか。 情報ありがとうございます。 早速、作成したURLで試してみたのですが、クラス名に日本語をつけると、ご指摘の通り、エラーがでますね……。ちょっとショックです……。 ＞ブラウザでも検証しましたが、下記のとおりOperaしかちゃんと認識されませんでした。 検証ありがとうございました。 ＞●CSS Validation Service ＞W3Cによって運営されており、 CSSをチェックするのに使うことができます。 ＞このツールは、 CSS 仕様と比較するだけでなく、エラーや、CSS の誤用等を発見したり、 ＞自分の書いたCSS が使い勝手を悪くするような場合に教えてくれたりします。 このツール知らなかったため、大変参考になりました。 ありがとうございました。
お礼
>W3Cはただの団体でCSS2仕様は別にあります。HTML4.01やXHTML1.0も別に定義されています。 解説ありがとうございました。何となく、一緒に定義されているものだと、勝手に勘違いしていました。 >仕様書を確認しましょう。 すいません、確認したつもりなのでしが、見方がかなり甘かったようです。ネットで随分探したのですが、この件に関する情報を探し出すことができず、また、仕様書に記載している内容も解釈がなかなか難しく、苦労していたので、大変助かりました。これを機会に、これからはなるべく仕様書を熟読するよう、気をつけたいと思います。 本当にありがとうございました！ おかげで知りたい情報を得ることができました。