HTML5 – CSS3 mag

YoutubeやHTML5video等の埋め込み動画のサイズをcssを使って動的にリサイズ/可変にするトリックをご紹介します。 解像度の違うスマートフォン（iPhone / Android）、IEにも適用されるようです。...

フォントサイズの指定は、相対指定のem、%、絶対指定のpxが一般的ですが、 CSS3の新しい「rem」という単位を使った指定方法をご紹介します。 emや%の相対指定の場合、親要素の影響を受け、子要素は複利計算されてしまい...

CSS3を使ったテキストエフェクトのご紹介です。 エンボスやグラデーションなど、Photoshopで作成したような効果を実現しています。 それぞれチュートリアルも用意されてあるので、見てみてください。 ■How to C...

A CSS3 Tipのエンリーからのご紹介。 「text-shadow」プロパティをサポートしているブラウザは色指定に「RGBa」が使えます。 「RGBa」の色指定でアルファを使用すれば、どのような背景でもtext-sh...

URLの最後に「&html5=True」を指定します。 例：http://www.youtube.com/watch?v=sGA9JaIa7WM&feature=&html5=True 　 ちなみ...

まだ試験段階ではあるようですが、iframeを使うようですね。 ■埋め込みコードサンプル この新しい埋め込みコードを使用すると、Flashがインストールされている場合はFlashで再生し、「Firefox」「Chrome...

以前紹介したie-css3.htcよりも対応するプロパティが多く、シャドウも奇麗に表示されるようです。 サポートしているプロパティは以下になります。 ・border-radius ・box-shadow ・border-...

ASCII.jpから、iPadをデジタルサイネージとして使用するという興味深いチュートリアルをご紹介します。 デジタルサイネージというのは室内・屋外に電子機器を利用して掲示する広告（電子看板）のことです。 チュートリアル...

HTML5、CSS3を使ったドロップダウンメニューを2つご紹介します。 ■Creating a pure CSS dropdown menu JavaScriptは使用しておらずCSSのみで実装されています。 チュートリ...

HTML5ではformに関する新しい機能も追加されました。今回はその中でrequired属性とpattern属性を紹介したいと思います。 これらの属性を使うと、フォームの入力エラーチェックを簡単に実装できます。 ■req...

HTML5ではformに関する新しい機能も追加されました。今回はその中でautofocus属性とplaceholder属性を紹介したいと思います。 ■autofocus属性 autofocus属性をあらかじめ指定しておく...

CSS Lectureからマルチカラムレイアウトで使えるCSS3 box 系プロパティのまとめをご紹介します。 ■display: box; の使い方 対応ブラウザ：Safari、Google Chrome、Firefo...