スタート!CSS入門

空セルの扱い

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
表の空セルの表示方法を指定するには、empty-cellsプロパティを使います。ここでは、empty-cellsプロパティの使い方について紹介します。
講師:
02:32

字幕

表のボーダーモデルがセパレート、分離ボーダーモデルのとき内容が空のセルの表示方法を変えるにはempty-cells プロパティを使います。このレッスンでは empty-cells プロパティの使い方について紹介します。empty-cells プロパティに使える値は「 show 」「 hide 」の各キーワードです。「 show 」は空セルのボーダーと背景を表示します。「 hide 」は表示しません。その他の仕様はご覧の表の通りです。では実際に CSS を書いてみましょう。編集画面とウェブブラウザを開きます。表にはすでに「 table 」要素「 th 」要素「 td 」要素に背景色。各セルにはボーダー、枠線も追加しています。一部のセルは empty-cells プロパティの効果を確認するために内容を空にしています。またボーダーモデルに「 separate 」分離ボーダーモデルを明示的に指定しています。empty-cells プロパティは分離ボーダーモデルのときのみ有効になりますので注意しましょう。では空セルの扱いを変更してみましょう。「 table 」要素に対して empty-cellsプロパティを記入します。 empty-cells プロパティです。このプロパティを使って空セルを非表示に設定します。非表示にするには値に「 hide 」と入力します。ウェブブラウザを見ると空セルのボーダーと背景が非表示になっていることを確認できます。なお Internet Explorer 7 は empty-cellsプロパティに対応していません。このレッスンでは表のボーダーモデルがセパレート、分離ボーダーモデルのとき内容が空のセルの表示方法を変えるempty-cells プロパティの使い方について学びました。

スタート!CSS入門

CSSはWebページに視覚的な表現、つまりスタイルを与えるための言語です。HTMLと組み合わせることで、より自由なデザインをウェブ上で実現できます。このコースでは初めてCSSに触れる方でも体系的な理解が得られるように、Web標準としての仕様の成り立ちからさまざまな文法、ボックスモデルなどの基本概念まで幅広い内容を解説します。

5時間21分 (71 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2014年11月25日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。