CSS3とHTMLの隠し機能/プロパティ/属性/タグ [終了]
質問
CSS と HTML の世界には常に機能があります (プロパティ/属性/タグ)これは周辺シナリオでは便利ですが、まさにそのため、ほとんどの人はそれらを知りません。CSS、CSS3、HTML5 に関する教科書では通常教えられていない機能を求めています。
あなたが知っているものは何ですか?
[アップデート]どのブラウザが HTML タグと CSS3 要素を採用していますか?そして、この新しいテクノロジー (HTML5) を自分のビジネスに活用できますか?
解決
私にとって、ほとんどの人が気づいていない HTML と CSS の分野の 1 つは、次のような HTML 要素による広範な国際化サポートです。 <ruby>
, 、次のような属性 hreflang=""
, 、およびCSSのような {list-style-type: cjk-ideographic;}
. 。確かに、私はこれらすべてを使用しましたが、大多数の人はそれらを使用する必要はありません。
2 番目の (おっと、最新の) 質問に答えると、ブラウザーは HTML5 と CSS3 仕様のさまざまな部分を、さまざまな割合で実装しています。一般に、Webkit ブラウザ (Safari、Mobile Safari、Crome) と FireFox が最も速く実装されており、Opera は良い仕事をしていますが、Internet Explorer は片隅に酔っています。@Kobiの答えには、どのブラウザが何をサポートしているかへのリンクがいくつかあります。
ビジネス サイトでこれらの新しい仕様をいつ信頼できるかについては、ユーザーとユーザーが使用するブラウザーに完全に依存します。サイトが iPhone ユーザーをターゲットにしている場合は、すでに多くの機能を使用できます。ただし、これはこの問題を考える最良の方法ではありません。角丸、ドロップ シャドウ、CSS グラデーションなど、実装されている CSS3 プロパティのほとんどは、実際には非常にうまく機能しなくなるため、これらを使用してユーザーに優れたブラウザーを提供できるようになります。この考え方はプログレッシブエンハンスメントと呼ばれます。
HTML5 に関しては、90% が HTML4 であり、エラー処理が定義されているため、HTML5 への変更は doctype を変更するのと同じくらい簡単で、その他の変更は必要ありません。新しいセマンティック要素を使用しない場合、IE は HTML5 で問題ありません。HTML5 doctype の利点は、参照するのにはるかに優れた仕様、より有益なエラー メッセージを備えた 2 つのバリデータです (@Marius は HTML5 を意味すると思います) フォーム 検証)、および ARIA ロールを使用する機能。について記事を書きました HTML4/XHTML1からHTML5への変更, 、そうすることによるメリットについて説明します。
HTH
他のヒント
CSS3 と HTML5 の優れた新機能のほとんどはまだ実装されていません。これには次のようなものが含まれます。
- CSS3 テンプレートのレイアウト
- CSS3 属性 例えば:[ソース]{内容:attr(ソース, URL);任意の項目のコンテンツを、source 属性の URL のコンテンツに置き換えます。
- HTML5 バリデーター
サイドノート http://code.google.com/p/ie7-js/ ie ブラウザが他のブラウザと同じように CSS 属性をサポートできるようにする機能を提供します。きちんとしたものには欠点もありますが、それでも非常にきれいです
そして今、私は少なくともあと1年、1年半は今後のテクノロジーにあまり依存しないつもりですが、それはそこに到達しています。開発者としては、これらのテクノロジの機能をサイトごとにテストすることをお勧めします。しかし、繰り返しになりますが、一般的に言えば、これほど驚くべき追加や変更を組み込む必要があるものは存在しません。
ところで、典型的な特徴がないとはどういう意味ですか?ニーズに応じてサイトごとに使用される典型的な機能はありません。
たとえば、ブログ、フォーラム、オンライン ストア、個人サイトのほとんどは、十分に確立された最小限の機能の領域に保たれています。これらの機能は十分に文書化されており、広くテストされ、使用されています。ある種の基準。
- Quirks モードによるクロスブラウザのサポート - 好みの機能までドリルダウンでき、非常に詳細な情報が得られます。
- いつ使用できますか - 機能がいつ一般に使用できるようになるか (そして今後になる予定) を示すインタラクティブな表。JavaScript の置換を受け入れるための便利なオプションもあります。
<Canvas>
IE6の場合。