HTML5 & CSS3 DEMO
説明：このページはhtml5とcss3のデモ用に作成しました。 Safari4とFirefox3で正しく表示出来ます。 Operaでも読めますが一部のみの対応です。 IEだと崩壊します。 正しく表示してもある意味崩れてますが。(・ω・) Link Text Link Text Link Text 新仕様のhtmlはwebの現状を踏まえて次世代のマークアップの為に作成された新しいhtmlです。（多分。） header、footer、nav、section等の多彩なレイアウトに相応しい要素に加え、canvas、video等、インタラクティブ・コンテンツの為の要素が加わっています。現在、標準化団体の提示する仕様に合わせ、ブラウザ製作者が対応しつつある状況で実装状況はまちまちですが、将来的には進化していくCSSやJavaScriptと共に使用する事によって充実したコンテンツを明快なコードで
HTML 5 in 5 minutes
HTML 5 is quite a hot topic at the moment, with good reason. HTML 5 is the first major update to HTML in over a decade. In the decade there was XHTML. XHTML was too limiting and very few sites actually were XML documents because they did not render in all browsers. XHTML did teach us a lot of good disciplines which should be followed when developing with HTML 5. When I refer to HTML 5, I am treati
HTML5 & CSS3 ブラウザ別サポート状況
What is an IP Address? An IP (short for “Internet Protocol”) address is a unique number assigned to every machine that connects to the internet. Nowadays, you can have multiple computers behind a router that share a single IP using Network Address Transformation (NAT). If you have ever used a wifi hotspot to access the internet, you’ve shared an IP address with someone. What’s the Difference betwe
HTML5 基礎知識 - web探検隊
HTML5を書くための基礎知識をメモHTML5の雛形XHTML5ではなくてHTML5のマークアップについて html> head> title>HTML5 基礎知識title> meta charset="UTF-8"> head> body> body> html> HTML5の新要素 文章構造に関するものsection汎用的なセクション。文章のアウトラインを構成する。articleセクションの一種で、Webページから独立したコンテンツを表す。asideセクションの一種で、外側のセクションに対する補足情報を表す。navセクションの一種で、外側のセクションに対するナビゲーションメニューを表す。footerセクションのフッター。headerセクションのヘッダー。hgroup複数の見出し(h1-h6)をまとめる。 外部コンテンツの埋込みfigureキャプションを伴うような内容のものを文章中に埋
HTML の link 要素によるナビゲーション
HTML での link 要素 HTML では link 要素を適切に使うことによって、 ユーザーエージェント (UA)に関連文書を表示させるようにすることができる。 ここでのユーザーエージェントは、ブラウザとほぼ同一の意味なので、以下ブラウザで統一する。 link 要素の使い方であるが、たとえば<head>～</head>領域に次のように書く。 <link rel="next" href="chapter2.html"> 上記記述は、本文書の次の文書が chapter2.html であることをリンクによって示している、という意味である。 以降、上記のrel="***" で記されている *** をリンクタイプと呼ぶ。 また、上記リンクがブラウザ固有の機能として表示される領域を、ナビゲーションバーと呼ぶ。 ブラウザごとによる表示の違い link 要素記述をしても、ナビゲーションバーを表示でき
CSS3とHTML5でつくるテンプレート集「15 Useful CSS3 and HTML5 Templates and Frameworks」
TOP > WebDesign > CSS3とHTML5でつくるテンプレート集「15 Useful CSS3 and HTML5 Templates and Frameworks」 言葉自体ははかなり浸透してきた次世代のWEBの標準的なになっていくとされているHTML5とCSS3。ブラウザも対応してきて、一部のWEBサイトで使われ始めてきていますが、今回紹介するのはCSS3とHTML5で制作されたテンプレートを集めたエントリー「15 Useful CSS3 and HTML5 Templates and Frameworks」です。 RamblingSoul 19 CSS3 Template 様々なテンプレートが公開されています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。 詳しくは以下 ■Ampersand HTML5 HTML5で制作されたテン
HTML5用のリセットCSS（正式版？） - IT-Walker on hatena
今年も明けましておめでとうございます。 白石です。 正月明けからイッパイイッパイです。 で、いきなり本題。 HTML5用のリセットCSS（どのブラウザでもデフォルトの見た目が同じになるよう、強制的に表示を調整するCSS）と言えば、昔HTML5Doctorで紹介されたやつが有名です。Google Codeでプロジェクトがホスティングされてもいます。 でもこのCSS、ちょっと悩ましいことに中途半端なんですよね。例えば、HTML5ではあらゆる要素にhidden属性を指定することができるのですが、「hidden属性のついた要素は非表示にする」と言ったスタイル指定が行われていなかったり。 で、完全なものはないのかというと、あります。それも仕様書の中に。これは、HTML5仕様が正式に「提案」しているものです。 でもどう見てもHTML5DoctorのCSSのほうが有名ですよね。 で、みんながその中途半端
とあるjavascriptの画像生成
元ネタ：とある櫻花の画像生成、とある画像の自動生成<ジェネレータ> HTML5のcanvasを使ってやっつけ仕事。グラデーションは面倒なのでやめた。SilverLightやサーバーサイドは、もはや過去の遺物である。これからはクライアントサイドのみで、これぐらいやるのが当たり前になるべきだ。フィード経由で閲覧している人は、ご面倒ではございますが、直接見ていただいくようお願いいたします。 主要ブラウザでテストしてみた結果。 Chrome, Safari: 完璧 Firefox: なぜか@ＭＳ ゴシックが意図通りに描画されない。 Opera: canvasの文字列描画をサポートしていない。 IE: えーと……とりあえずお前はカエレ。 グラデーションは、思いのほか簡単だった。 Anonymous said... 私はWindowsでSafari 4を使っていますが、振り仮名（インデックス）の部分が
HTML5 を学ぶための情報源まとめ
ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日本語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。 やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日本語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちなみに、XHTML 好きな私としては、XHTML5 で次のサイトリニューアルとか
第3回 HTMLとXHTML、HTML5 | gihyo.jp
HTML5という新しい仕様がでてきましたが、既存のHTMLやXHTMLとはどのような関係があるのでしょうか。簡単にHTMLとXHTMLの歴史を振りかえりながら、両者が抱えた問題や、HTML5の目的について説明しようと思います。 HTML ― 拡張のなかで進化していった言語 HTMLはWeb上での情報交換フォーマットとして、Tim Berners-Leeにより生み出されました。「シンプルなハイパーテキストを記述する」という目的があったため、定義されている要素は見出しやリスト、リンクなど、文書構造や文章の意味を記すものに限られていました。 ところが、Webが普及するにつれ、視覚表現をコントロールする要素（いわゆる「タグ」）がブラウザーベンダーにより追加されていき、語彙が膨れ上がってしまいました。さらには、要素の意図とは異なった使われ方をされる例（blockquoteやtableなど）が増
XHTML & CSS Lightbox
A valid XHTML & CSS Lightbox (no JavaScript) by Jenna Smith / Opera fix by Tobias Wiersch Click any of the links below to see it in action Lorem ipsum dolor sit amet, consectetur about us adipiscing elit. Donec massa lorem, elementum et mollis non, viverra a est. Proin nunc orci, tristique at egestas et, interdum ac ipsum. Nulla ullamcorper vulputate erat ac gravida. Mauris facilisis, leo ac condi
index of HTML5 elements
index of HTML5 elements last-modified: Fri Jun 11 16:28:00 2010 a abbr address area article aside audio b base bdo blockquote body br button canvas caption cite code col colgroup command datalist dd del details dfn div dl dt em embed fieldset figcaption figure footer form h1 h2 h3 h4 h5 h6 head header hgroup hr html i iframe img input ins kbd keygen label legend li link map mark menu meta meter na
Another HTML-lint 導入ガイド | 鳩丸よもやま話
Another HTML-lint とは？Another HTML-lint は、いしの k16 さん作の HTML 文法チェッカです。HTML 文書が DTD に従ってマーク付けされているかチェックできるのはもちろん、アクセシビリティやブラウザ実装との互換性の問題など、かなり細かい点までチェックすることができます。 非常に高機能なチェッカですが、嬉しいことに原則としてフリーです。ありがたく使わせていただきましょう。 ※非営利目的の使用ならばフリーなのですが、営利目的の使用はフリーではないので注意してください。Web制作会社が業務に使う場合、パソコン教室で使う場合などが該当するそうです。その場合のライセンスは 15,000円です。 ※非営利の個人はフリーで使えますが、作者にビールをおごることが推奨されています。:-) Another HTML-lint の使い方概要Another HTML
The W3C Markup Validation Service
Validate by URI Validate a document online: Address: More Options
[html] HTML5のサンプルソースと仕様メモ
HTML5のサンプルソースを作りがてら調べた仕様などを適当にメモっています。 サンプルはこのブログのトップをHTML5化したものです。 この記事を書いてからHTML5で組んだものがいくつかあります。参考にどうぞ。 コーディングコンテストに出したやつ ZeroMailの解説ページ HTML5 のタグが付いている記事 HTML4・XHTML1.0からの主な違い 新しく追加された要素 – section, article, footer, audio, video, progress, nav, meter, time, aside, canvas, datagrid ※firefoxでは新要素がvoidになるので、CSSでdisplay:blockが必要。（MIMEをXHTMLのにすればおｋらしい） ※IEではjavascriptによるフォローが必要。 新しいフォームのコントロールタイプ –
![[html] HTML5のサンプルソースと仕様メモ](https://cdn-ak-scissors.b.st-hatena.com/image/square/600513d118398b09ecdf489a388a0584fedd87b8/height=288;version=1;width=512/http%3A%2F%2Ftenderfeel.xsrv.jp%2Fwtn%2Fwp-content%2Fuploads%2F2009%2F07%2Fhtml5-300x203.jpg)
HTML5タグリファレンス - HTML5.JP
W3C HTML5 の「第4章 HTMLの要素 (4 The elements of HTML)」とそれに関連する項目をもとに、HTML5 の HTML タグリファレンスをご用意しました。主に HTML5 の仕様の和訳となります。 正確性を求める場合は、最新の原文を参照してください。また、もし本サイトのリファレンスが、最新の仕様と異なる部分がありましたら、ご指摘頂けると幸いです。 コンテントモデル HTML5 の要素は、コンテントモデルと呼ばれるグループに分類されます。このコンテントモデルは、その要素の中に入れても良いものを定義します。HTML5 をマークアップするには、このコンテントモデルを意識しなければいけません。まず最初に、コンテントモデルを理解しましょう。 グローバル属性 すべての要素で共通に使える属性をグローバル属性と呼びます。class 属性や id 属性など、これまでによく使
HTML5 における HTML4 からの変更点
この文書は「HTML5 differences from HTML4 (W3C Working Draft 25 May 2011)」の日本語訳です。 原文の最新版 は、この日本語訳が参照した版から更新されている可能性があります。 この日本語訳は参考情報であり、正式な文書ではないことにご注意ください。また、翻訳において生じた誤りが含まれる可能性があります。他の仕様の訳については Web 標準仕様 日本語訳一覧 を参照してください。 更新日: 2011-09-15 公開日: 2011-05-26 翻訳者: 矢倉 眞隆 <yakura-masataka@mitsue.co.jp> HTML5 における HTML4 からの変更点 2011年5月25日付 W3C 草案 (Working Draft) この版: http://www.w3.org/TR/2011/WD-html5-diff-2011
HTMLからXMLへ！Webを彩るコンテンツを知ろう (1/4)
インターネット上でのショッピングやブログの更新、映像の視聴など、現在では多種多様なコンテンツを見られるようになった。このパートではWebの「中身」であるコンテンツの仕組みについて見ていこう。 WebブラウザとWebサーバの仕組みを使ってやり取りされる情報がコンテンツだ。まずブラウザでコンテンツを表示する仕組みから見てみよう。WebページはHTML（HyperText Markup Language）という、文書構造を記述するためのマークアップ言語で作られている。HTMLは1997年1月にW3C（WWW Consortium）にて初めて標準化された。 HTMLには見出しや文字の大きさといった文書の見栄えを定義する、「タグ」と呼ばれる情報が数多く規定されている。記述方法は、これらのタグで表現したい範囲の文書を挟むという形式である。このタグは色情報を指定するcolorや文字サイズを指定するsiz
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
*My First HDML*
http://www.coders.me/ejemplos/sexy-forms/
