定義と使用法
visibilityプロパティセットまたは要素が可視であるかどうかを返します。
visibilityプロパティは、著者が要素を表示または非表示にすることができます。 それはに類似している表示プロパティ。 隠された要素の内容が見えなくなることを意味するが、要素が元の位置と大きさにとどまる：どれも視認性が一方で、それは、全体の要素を非表示にします。しかし、違いは、ディスプレイを設定していない場合ということです。
ブラウザのサポート
visibilityプロパティは、すべての主要なブラウザでサポートされています。
構文
visibilityプロパティを返します：
object .style.visibility
visibilityプロパティを設定します。
object .style.visibility="visible|hidden|collapse|initial|inherit"
プロパティ値
| 値 | 説明 |
|---|---|
| visible | 要素が表示されています。 これがデフォルトです |
| hidden | 要素が表示されていないが、それでもレイアウトに影響を与えます |
| collapse | 表の行またはセルに使用される場合、要素は表示されない(same as "hidden") |
| initial | このプロパティがデフォルト値に設定します。 最初の記事を読みます |
| inherit | その親要素からこのプロパティを継承します。 継承についての記事を読みます |
技術的な詳細
| デフォルト値： | 目に見えます |
|---|---|
| 戻り値： | 要素のコンテンツが表示されているか否かを表す文字列 |
| CSSのバージョン | CSS2 |
その他の例
例
表示特性と可視性との間の差：
function demoDisplay() {
document.getElementById("myP1").style.display = "none";
}
function demoVisibility() {
document.getElementById("myP2").style.visibility = "hidden";
} »それを自分で試してみてください 例
非表示と表示<img>要素を：
function hideElem() {
document.getElementById("myImg").style.visibility = "hidden";
}
function showElem() {
document.getElementById("myImg").style.visibility = "visible";
} »それを自分で試してみてください 関連ページ
CSSチュートリアル： CSS表示と可視性
CSSリファレンス： visibility property
<スタイルオブジェクト