We’ve had a number of people ask about templates, boilerplates, and styling for HTML 5. Last week, Remy introduced some basic boilerplates for HTML 5, so to keep the momentum going, I’ve modified Eric Meyer’s CSS reset for you to use in your HTML 5 projects. The code Let’s start with the complete CSS stylesheet: /* html5doctor.com Reset Stylesheet v1.6.1 Last Updated: 2010-09-17 Author: Richard Cl
What a brilliant idea! For the longest time HTML5 specified, and advised developers, that it no longer mattered what the number (1 to 6) was in a heading element (when used in conjunction with sectioning elements). What mattered was the nesting level of the H1-h6 in sectioning elements, just like the X<H>TML promised land, but […] Read full post HTML5 Element Index Head doctype html head title bas
HTMLファイ部のほんだです。シュッ 「ページ遷移」、聞くだけでゾクゾクしませんか？ 僕は大好きです。 Web Creator's Contest Q（HTML、CSS、JavaScript エンジニアのためのコンテストサイト）では、 ページ遷移・画面遷移をテーマにしたコンテストを開催中です。 とても好評で、5回目となった当コンテスト。 今回のテーマも、力の入ったコードがたくさん投稿されています！ 魅力的な画面遷移エフェクトのコード集！ Cubic Transition ※「▶Play」ボタンをクリック！
This is the display name of the sample. It must have a unique name.
こんにちは、鴨田です。 個人的に仕事の大半はスマートフォン関連なので、 最近のマークアップはほとんど全てHTML5+CSS3で行っています。 とはいえ、PC向けのサイトではまだまだHTML4.01、XHTML1.0、CSS2.1を使用している場合が多いと思います。 ですので、今回はHTML5+CSS3を導入するにあたって、役立つと思う7つの設定について、書きたいと思います。 １．HTML5の初期テンプレート案 <!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title>HTML5 初期テンプレート</title> <!-- reset.cssの設定 --> <link rel="stylesheet" media="screen" href="reset.css" /> <!-- Viewportの設定 --> <meta nam
HTML5に関連する技術のひとつに、WebGLがあります。WebGLは、ブラウザー上で3DCGプログラミングを実現できる技術です。今回のレポートでは、WebGLプログラミングの基礎知識についてご紹介します。 WebGLって？ WebGLでどんなことができるのか──百聞は一見にしかず。まずは例を見てみましょう。demo内のスライダー部分をドラッグすることでカメラの位置などを任意に変更できますので、リアルタイムでレンダリングされていることがわかるでしょう。 (invalid jsdo.it code) このように、ブラウザー上でプラグインに頼ることなく、なめらかな表面、自然な影、高FPSでのリアルタイムレンダリング（アニメーション）など、まるで最近の家庭用ゲーム機にも匹敵する高度な3DCG表現ができるわけです。 WebGLは2013年10月現在、Chrome、Firefox、Operaで標準対
<table class="table table-striped table-responsive"> <thead> <tr> <th>First Name</th> <th>Last Name</th> <th>Age</th> <th>Total</th> <th>Discount</th> <th>Difference</th> <th>Date</th> </tr> </thead> <tbody> <tr> <td>Bruce</td> <td>Almighty</td> <td>45</td> <td>$153.19</td> <td>44.7%</td> <td>+77</td> <td>Jan 18, 2001 9:12 AM</td> </tr> <tr> <td>Bruce</td> <td>Evans</td> <td>22</td> <td>$13.19</td
clip() メソッドは、非ゼロ巻数規則を使って、現在のクリッピング領域と現在のパスで描画された領域とが重なる部分を計算して、新たなクリッピング領域を生成しなければいけません。開いたサブパスは、クリッピング領域を算出するときに、暗黙に閉じられなければいけません。実際のサブパスには影響しません。新たなクリッピング領域は、現在のクリッピング領域を置き換えます。 コンテキストが初期化されるとき、クリッピング領域は、左上端が (0,0) で座標空間の幅と高さを持つ矩形にセットされなければいけません。 原文：http://www.w3.org/TR/2010/WD-2dcontext-20100624/#dom-context-2d-clip サンプル clip() メソッドは、呼び出される直前までに生成されたサブパスの図形で、切り取り窓がセットされると考えてください。clip() メソッドは、切り
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
すべての Microsoft 製品 Global Microsoft 365 Teams Copilot Windows Surface Xbox セール 法人向け サポート ソフトウェア Windows アプリ AI OneDrive Outlook Skype OneNote Microsoft Teams PC とデバイス Xbox を購入する アクセサリ VR & 複合現実 エンタメ Xbox Game Pass Ultimate Xbox とゲーム PC ゲーム 映画とテレビ番組 法人向け Microsoft Cloud Microsoft Security Azure Dynamics 365 一般法人向け Microsoft 365 Microsoft Industry Microsoft Power Platform Windows 365 開発者 & IT Microso
この記事は年以上前に書かれたもので、内容が古かったり、セキュリティ上の問題等の理由でリンクが解除されている可能性があります。 あまりに情報量が多くて混乱してきたので 自分用にまとめ。リファレンスとか、ちゃんと 実践で使えるツールを自分なりに厳選して まとめておきます。どうも、あっちこっちで あれが便利とかこれが便利だとか言われる と訳が分からなくなるのでそろそろ絞らない とですね。 というわけでお遊びではなく実践に役立ってる基本的なリファレンスとか助けてくれるツールのメモなので目新しいものはありません。完全に自分用のまとめです。個人的には基礎用のサイトと、実践向けのツールやライブラリだけあればいいという感じです。 尚、css3/html5に関する情報だけを求めている&特に情報取得に急いでないならdotHTML5というサイト1つで事足りるかと思います。 ※W3Cは割愛でいいですよね チートシ
Dreamweaver CS6 と HTML5 で始めようスマートフォン＆タブレット対応 HTML5 特設サイトは、HTML5/CSS3 やモバイルデバイスの活用を検討している方に最新情報をお届けするアドビ公式サイトです。 事例から Adobe®Dreamweaver® CS6 を始めとする制作環境まで、幅広い観点から Web の新しい方向性をお伝えします。 本文へ 本サイトについて 本サイト自体が、マルチデバイス対応のレスポンシブなデザインの事例として制作されています。表示される画面の大きさに応じて、閲覧し易い様にレイアウトが変化します。詳しくは「互換化とは」をご覧ください。 jQuery Mobile を使ったスマートフォン向けの専用サイトも公開中です。
怖話を開くといきなり始まる怖〜いムービー。 これ、HypeというMacのアプリで作りました。 Hype Hypeはすごく簡単にHTML5のアニメーションが作れて、しかも値段は ¥2,600！（2011年9月現在） HTML5でムービーが作れるのでiPhoneでもちゃんと表示されます。 ホームページ制作会社の方がiPhoneサイトを作る際にHypeでムービーを設置したら、よりお客さんに満足いただくものを納品出来そう。操作は簡単なので、使い方を説明するまでもないのですが、まぁ、こんなことが出来るっていうのの参考に、Hypeの使い方や手順をこちらで紹介したいと思います。 Hypeを購入、インストール HypeはMac版しかありませんので、Windowsの方はMacを買うところから（Macの購入はこちら）。 HypeはMac App Storeで購入します。こちらクリック。Mac App Stor
basket.jsはローカルストレージにJavaScriptをキャッシュして高速化をはかるソフトウェアです。 Webの高速化を語る上でキャッシュの存在は欠かせません。そこで使ってみたいのがbasket.jsです。何とHTML5のローカルストレージを使ってキャッシュする仕組みを提供します。 最初の実行。underscore.jsなどが読み込まれています。2回目以降は消えます。 でもちゃんとjQueryオブジェクトは存在します。 basket.requireメソッドを使って対象ファイルを読み込みます。有効期限を設定することも可能です。読み込み失敗をハンドリングすることもできます。普段はそのまま利用でき、remove()やclear()でファイルを解除できます。 basket.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る ロ
2012年12月17日、World Wide Web Consortium（W3C）が、HTML5およびCanvas 2Dの仕様策定完了を発表しました。現時点ではW3C標準ではなく、最終的な標準化完了（勧告化）は2014年の予定です。 W3CがHTML5仕様策定完了、勧告候補に。HTML5.1のドラフトも発表（Publickey 2012/12/18付け記事） http://www.publickey1.jp/blog/12/w3chtml5html51.html HTML5 Definition Complete, W3C Moves to Interoperability Testing and Performance（W3C 2012/12/17付けニュース） http://www.w3.org/News/2012.html#entry-9667 W3CがHTML5の仕様策定を完了、
<iframe>タグは、インラインフレームを作る際に使用します。 インラインフレームとは、文書内に別の文書などの閲覧コンテンツを入れ子に配置したもののことです。 src属性は、文書内に別の文書をフレーム表示する際に使用します。 src属性の値には、フレーム表示する文書のURLを指定します。 ■HTML4.01からHTML5へのバージョンアップによる変更点 HTML5では、frameborder属性・marginheight属性・marginwidth属性・scrolling属性・longdesc属性が廃止されています。 一方で、新しくsrcdoc属性・sandbox属性・seamless属性が追加されています。 ■フレーム表示する内容をsrcdoc属性の値として指定 srcdoc属性は、フレーム表示する内容を属性値として指定する際に使用します。 指定する内容の中にダブルクォーテーション（
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
