Visibility 屬性定義及使用說明
visibility 屬性指定一個元素是否是可見的。
提示:即使不可見的元素也會占據頁面上的空間。請使用 "
display" 屬性來創建不占據頁面空間的不可見元素。
默認值: | visible |
---|
繼承: | yes |
---|
版本: | |
---|
JavaScript 語法: | object.style.visibility="hidden" |
---|
Visibility 屬性的用法
Visibility 屬性共有四個可用的值(
visible、
hidden、collapse 和inherit),但常用的值是visible 和hidden。
值 | 描述 |
---|
visible | 默認值。元素是可見的。 |
hidden | 元素是不可見的。 |
collapse | 當在表格元素中使用時,此值可刪除一行或一列,但是它不會影響表格的布局。被行或列占據的空間 會留給其他內容使用。如果此值被用在其他的元素上,會呈現為 "hidden"。 |
inherit | 規定應該從父元素繼承 visibility 屬性的值。 |
瀏覽器支持
所有主流瀏覽器都支持 visibility 屬性。但是,任何的版本的 Internet Explorer (包括 IE8)都不支持 "inherit" 和 "collapse" 屬性值,而支持visible 和hidden值。
實例
<html>
<head>
<style type="text/css">
h1.visible {visibility:visible}
h2.invisible {visibility:hidden}
</style>
</head>
<body>
<h1 class="visible">這裡的內容是可見的</h1>
<h2 class="invisible">這裡的內容是不可見的</h1>
</body>
</html>
在這個實例中,H1使用了CSS visibility:visible,因此它的內容可見,而H2使用了CSS visibility:hidden ,H2的內容則不可見。
Visibility和Display的區別
雖然 Visibility 和 Display 屬性都可以隱藏一個元素,但它們之間的不同點在於 visibility: hidden 在隱藏一個元素的同時仍然在頁面上為該元素保留所需的空間,而 display: none 則表現得像把元素從頁面里刪除了,在頁面上看不出該元素還存在著。
另外,display: block 和 display: inline 的區別在於 block 元素會在頁面中獨占一行,而 inline 元素不會,有的對象默認為 block 元素,而有的對象則默認為 inline 元素,大家在使用時需要注意防止相同屬性的重複定義。
Visibility 和Display 屬性雖然都可以達到隱藏頁面元素的目的,但它們的區別在於如何回應正常文檔流。
如果你想隱藏某元素,但在頁面上保留該元素的空間的話,你應該使用visibility:hidden 。如果你想在隱藏某元素的同時讓其它內容填充空白的話應該使用display:none 。
在現實中我發現人們更多的傾向於使用display 屬性(相信這也是大多數人的習慣)。當你決定用display:none 來隱藏一個元素時,你必須知道其它內容將填充到該元素留下的空白位置,從而改變頁面的布局。
Visibility 對SEO 的影響
在
SEO中有時我們會通過把堆砌的關鍵字隱藏而達到作弊的目的,但不應該使用visibility:hidden 和display:none ,而應該把關鍵字顏色設為和背景色相同,或者把關鍵字的字號設為非常小,而令訪客無法發現。
有的人則因為害怕搜尋蜘蛛的的反感而為visibility:hidden 和display:none 的使用的煩惱。其實有很多漂亮的效果是通過元素可見性的轉換而實現的,搜尋引擎也理解這一做法(事實上搜尋引擎往往忽略CSS),因此如果你的目的不是欺騙
搜尋引擎,你大可以放心地使用visibility:hidden 和display:none 去隱藏內容。
PHP Visibility
Visibility
The visibility of a property or method can be defined by prefixing the declaration with the keywords: public, protected or private. Public declared items can be accessed everywhere. Protected limits access to inherited and parent classes (and to the class that defines the item). Private limits visibility only to the class that defines the item.
Members Visibility
Class members must be defined with public, private, or protected.
例子 19-8. Member declaration
<?php/** * Define MyClass */class MyClass{ public $public = 'Public'; protected $protected = 'Protected'; private $private = 'Private'; function printHello() { echo $this->public; echo $this->protected; echo $this->private; }}$obj = new MyClass();echo $obj->public; // Worksecho $obj->protected; // Fatal Errorecho $obj->private; // Fatal Error$obj->printHello(); // Shows Public, Protected and Private/** * Define MyClass2 */class MyClass2 extends MyClass{ // We can redeclare the public and protected method, but not private protected $protected = 'Protected2'; function printHello() { echo $this->public; echo $this->protected; echo $this->private; }}$obj2 = new MyClass2();echo $obj->public; // Worksecho $obj2->private; // Undefinedecho $obj2->protected; // Fatal Error$obj2->printHello(); // Shows Public, Protected2, not Private?>注: The php 4 method of declaring a variable with the var keyword is no longer valid for php 5 objects. For compatibility a variable declared in php will be assumed with public visibility, and a E_STRICT warning will be issued.
Method Visibility
Class methods must be defined with public, private, or protected. Methods without any declaration are defined as public.
例子 19-9. Method Declaration
<?php/** * Define MyClass */class MyClass{ // Contructors must be public public function __construct() { } // Declare a public method public function MyPublic() { } // Declare a protected method protected function MyProtected() { } // Declare a private method private function MyPrivate() { } // This is public function Foo() { $this->MyPublic(); $this->MyProtected(); $this->MyPrivate(); }}$myclass = new MyClass;$myclass->MyPublic(); // Works$myclass->MyProtected(); // Fatal Error$myclass->MyPrivate(); // Fatal Error$myclass->Foo(); // Public, Protected and Private work/** * Define MyClass2 */class MyClass2 extends MyClass{ // This is public function Foo2() { $this->MyPublic(); $this->MyProtected(); $this->MyPrivate(); // Fatal Error }}$myclass2 = new MyClass2;$myclass2->MyPublic(); // Works$myclass2->Foo2(); // Public and Protected work, not Private?>