シンプルは嫌!ウェブ上で高機能な表(テーブル)を作る6つの技 大量の情報を見やすく掲載するには表組み(テーブル)を活用するのが定石。でも、HTMLだけで作る表組みは、見栄えも機能もシンプルすぎて嫌!……というアナタに、ソート・抜粋機能の付加など、ウェブ上の表を見栄え良く高機能化する6つの技をご紹介!
シンプルは嫌!ウェブ上で高機能な表(テーブル)を作る6つの技 大量の情報を見やすく掲載するには表組み(テーブル)を活用するのが定石。でも、HTMLだけで作る表組みは、見栄えも機能もシンプルすぎて嫌!……というアナタに、ソート・抜粋機能の付加など、ウェブ上の表を見栄え良く高機能化する6つの技をご紹介!
画面サイズ別にCSSをメディアクエリで切り替える方法画面サイズ別にCSSをメディアクエリで切り替える方法を解説。メディアクエリとは、画面サイズなどの閲覧環境に応じて適用スタイルを切り替えるCSSの機能です。レスポンシブWebデザインを作る際にも使い、HTMLのmedia属性値やCSSの@media規則で条件を指定します。スマホ専用スタイルや、PC等の広い画面幅向けスタイルなどを作成しておき、簡単に切り替えられます。 メディアクエリ(Media Queries)とは、画面サイズや画面解像度などの閲覧環境に応じて適用スタイルを切り替えられるCSSの機能で、CSS3から追加されました。従来からCSSの仕様にあった、デバイスの種類に応じて適用スタイルを切り替えられるメディアタイプ(Media Type)を拡張して作られた仕様です。 メディアクエリを使うことで、Webページの閲覧者が利用しているデバ
Creating Different CSS3 Box Shadows Effects [ad#ad-2] デモ 実装 デモ デモはbox-shadowに対応した下記のブラウザでご覧ください。 対応ブラウザ Internet Explorer 9.0+ Firefox 3.5+ Chrome 1+ Safari 3+ Opera 10.5+ デモページ [ad#ad-2] 実装 基本となるHTML 8つの各デモのHTMLの基本は同じで、class名が異なるだけです。 <div class="box effect"> <h3>Effect</h3> </div> 基本となるCSS div要素とh3要素の基本となるスタイルです。 .box h3{ text-align:center; position:relative; top:80px; } .box { width:70%; height
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く