[B! CSS][IE8] beth321のブックマーク

beth321 id:beth321

CSSとIE8に関するbeth321のブックマーク (3)

[CSS]動画を背景に使い、オーバーレイでコンテンツを配置するテクニック（IE8、スマホへの対応方法）
動画を背景としてブラウザいっぱいに表示し、その上にオーバーレイでコンテンツを配置するCSSのテクニックを紹介します。動画の背景はレスポンシブ対応、video要素に対応していないIE8や、動画の自動再生に対応していないスマホへの対応方法も！ Create Fullscreen HTML5 Page Background Video 下記は各ポイントを意訳したものです。以前紹介した時（前の記事）からアップデートされ、実装の解説も充実しているので、改めて許可を得て翻訳しました。中の人は、Smashing Magazineのエディタさんです。動画を背景に使う時の大切なポイントデモ CSSで動画を背景にしたコンテンツを実装する方法動画を背景に使う時の大切なポイント動画をサイトに使う時は、動画が単にかっこいいからという理由ではなく、サイトのメッセージが伝えられる動画を使用しましょう。動
beth321 2014/09/05
コリス

videoタグ

レスポンシブ

webデザイン

動画

CSS3

背景

HTML5

CSS

IE8
リンク
[CSS]box-sizingを使ったIE8+対応の画像やテキストを画像に置換するテクニック
img要素やhr要素、テキストなどをHTMLは変更せずに、スタイルシートで画像に置換するテクニックを紹介します。 img要素で配置した画像を別の画像に、hr要素を画像の区切りに、見出しなどのテキストを見出し画像に変更できます。 Replace the Image in an <img> with CSS 下記は、ポイントを意訳したものです。元のHTMLファイル事の発端は、HTMLやJavaScriptを編集できない状態で、画像を変更する必要にせまられたものです。どのように画像を変更したか紹介します。 HTML HTMLはこんな感じです。 .headerに子要素で画像が配置してあります。background-imageは無しです。 <head> <title>Really Cool Page</title> </head> <body> <div class="header"> <img
beth321 2013/05/29
　国際ニュース　コリス

css

css

css3

background

IE8

対応

h_<hr>

FIR

Web

テキスト
リンク
IE8以上ならもうスクリプト無しでOKのモーダルウインドウを表示するスタイルシート -CSS Modal
テキストや画像などのリンクをクリックすると、画像をはじめあらゆるHTMLの要素が配置可能なモーダルウインドウを表示するスタイルシートを紹介します。 CSS Modal CSS Modal -GitHub CSS Modalのデモ CSS Modalの使い方 CSS ModalのデモデモはIE9を含む、すべての最新のモダンブラウザでご覧ください。モバイル系は、iOS, Android2/3/4のMobile Safariで非常に機能し、Windows Phone8でも機能します。 IE7以下は非サポートで、IE8はエフェクトなしで機能します。まずは、テキストを配置したモーダルウインドウから。 Modal Text モーダルウインドウ内にトリガーを設定することも可能で、「Open a new modal」をクリックすると別のウインドウが開きます。ウインドウを閉じるには、右上のクローズをク
beth321 2013/05/14
　コリス

css

CSS

CSS3

web制作

モーダル

lightbox

HTML

モーダルウインドウ

あとでみる

ie8
リンク
1