65

私はジュニアを教えています。高校/高校のWebプログラミングクラスです。CSSに進む前に、フォントや色などの単純な要素と属性から始めます。色が廃止され、フォントがHTML5に含まれていないことは知っていますが、教育目的では、単純なHTMLタグから始めて、CSSに進むのが便利だと思います。授業の最初の週にページの色を変えることができることで、生徒たちは大きな喜びを得ることができます。（私はまた、1週目にマーキーとブリンクを教えますが、彼らが再びそれらを使用すると、ポイントを失うことを彼らに知らせます）。

生徒の1人は、「スキットルズ」や「スパイダーマン」など、色属性値に奇妙なものを入れて宿題を提出し始めました。私はこれを試し始めましたが、フォントタグのcolor = ""属性に入力したほぼすべてのものが、ある種の色を生成することを発見しました。また、IE、Firefox、Chrome、Opera、Safariの最新バージョン間で色が一貫しているようです。

「LuckyCharms」をCSSカラーとして入れても機能しないことを発見しました。これは、HTML属性で色が期待される場合にのみ機能するようです。たとえば、fontcolor="LuckyCharms"やbodybgcolor="LuckyCharms"などです。

なぜこれが起こるのかをクラスに説明しようとしていますが、これまでのところ、それを理解することができませんでした。または、Googleに良い答えを与えることができませんでした。カラーコードとして解釈されているように見えますが、どうしたらいいのかわかりません。

更新：試行錯誤の末、ほとんどすべての文字列を対応する16進色に変換するために、（提供されているリンクを使用して）5ステップのアルゴリズムを決定しました。ここでは、将来の訪問者を啓蒙するためのアルゴリズムを提供します。

  1. 16進以外の各文字を0に変更します。
  2. 文字列の長さが3の倍数になるまで、文字列に0を追加します。
  3. 文字列を3等分します。
  4. サブ文字列の長さが2より長く、3つのサブ文字列すべてが0で始まる場合は、各文字列から先頭の0を削除します。
  5. サブ文字列の長さがまだ2より大きい場合は、各サブ文字列を2文字に切り捨てます。

これで、サブストリングをまとめると、16進カラーコードが得られます。このアルゴリズムを約20の異なるサンプルで検証し、FirefoxColorZillaアドオンカラーピッカーを使用して結果を比較しました。

この場合、ルールは実際、回答の1つで指定されたリンクに具体的に記載されており、すべてのブラウザーで順守されることに注意してください。したがって、これはどのブラウザでも機能することを期待できるものです（本当に面白い色の名前を使用したい場合）。

4

4 に答える 4

33

HTML 5仕様には、レガシーカラーを解析するためのルールが含まれています。

それらはかなり長く、ブラウザが壊れたコードをどのように処理するかについて一貫性を保つことができるように設計されています。

于 2012-10-17T16:51:07.187 に答える
5

とても興味深い。ブラウザは（af）できるすべての文字を解釈し、一致しない場合は残りを0のままにするようです。例えば：

Spiderman
 00DE0 A

ただし、さらに実験が必要です。

于 2012-10-17T16:55:07.457 に答える
3

これは興味深い質問です。

簡単な実験の結果、「Luck」は「LuckyCharms」と同じ色（とにかく私の目には）を生成しますが、「LuckBeALady」はより暗い色合いになり、「LuckBeALadyTonight」はより青い色になります。

ところで、私の最初の考えは、認識可能な16進文字に作用しているということでしたが、それによって「LuckyCharms」がccaに変わり、黒くなりました。うちはマダラが示唆するように、0と16進文字の組み合わせは、「LuckyCharms」と同じ草を緑色にレンダリングできませんでした。

答えはありません。

于 2012-10-17T17:01:42.573 に答える
2

予想されることの基本的な答えは、「ブラウザによって異なります」です。5より前の以前のバージョンのHTMLの問題の1つは、ブラウザが非標準のHTMLに遭遇したときに何が起こるかが指定されていないことです。@Madara Uchihaからの解釈は、ブラウザが色の仕様を解釈する方法の一例ですが、ブラウザがクラッシュしたり、CDトレイを取り出したり、モニターの解像度を400x300に変更したりすることは、標準的には許容されます。 px。もちろん、これは理想的ではありません。したがって、非標準のHTMLカラー仕様に遭遇した場合にどうなるかについて、一度に1人のプログラマーのアイデアが表示されます。

CSSで発生しない理由は、CSSが色を解釈する別のパーサーであるためです。この同じパーサーは、インラインCSSであるか、リンクされたCSSドキュメントであるかにかかわらず、色を解釈します。CSSは、不適切な値が検出されたときに何が起こるかを定義します。それは無視され、ドキュメントにはまったく影響しません。

これは学生にとって重要な理解の分野であり、私が知る不幸な専門家もいるので、これは標準への準拠についてクラスに話す良い機会だと思います。彼らが「でもカラースキットルズはうまくいく」と言うと、それを見るとうまくいくと言うことができますが、それが彼らのインストラクターのブラウザをクラッシュさせ、彼らに大きな太ったFをもたらす可能性は十分にあります。実世界のシナリオでは、デモ時に他の誰かのくだらないコードが正しく機能しないために週末をあきらめなければならない場合があります。

でも私は苦くない。多くの場合 ：）

于 2012-10-17T17:15:57.363 に答える