backface
Backface
visibility
Visibility
英[?v?z??b?l?ti] Beauty [?v?z??b?l?ti]
css backface-visibility attribute syntax
Function:The backface-visibility attribute defines whether the element is visible when it is not facing the screen. This property is useful if you rotate an element and don't want to see its back side.
Syntax: backface-visibility: visible|hidden
Description: visibleThe back side is visible. The hidden backside is invisible.
css backface-visibility attribute example
<!DOCTYPE html>
<html>
<head>
<style>
div
{
position:relative;
height:60px;
width:60px;
border:1px solid #000;
background-color:yellow;
transform:rotateY(180deg);
-webkit-transform:rotateY(180deg); /* Chrome and Safari */
-moz-transform:rotateY(180deg); /* Firefox */
}
#div1
{
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
}
#div2
{
-webkit-backface-visibility:visible;
-moz-backface-visibility:visible;
-ms-backface-visibility:visible;
}
</style>
</head>
<body>
<p>本例有兩個(gè) div 元素，均旋轉(zhuǎn) 180 度，背向用戶(hù)。</p>
<p>第一個(gè) div 元素的 backface-visibility 屬性設(shè)置為 "hidden"，所以應(yīng)該是不可見(jiàn)的。</p>
<div id="div1">DIV 1</div>
<div id="div2">DIV 2</div>
<p><b>注釋?zhuān)?lt;/b>本例只在 Internet Explorer 10、Firefox、Chrome 以及 Safari 中有效。</p>
</body>
</html>Run instance ?
Click the "Run instance" button to view the online instance