css3怎么设置元素背面不可见-木庄网络博客

本文摘自PHP中文网，作者青灯夜游，侵删。

在css3中，可以利用backface-visibility属性，通过给元素添加“backface-visibility: hidden;”样式来设置背面不可见。backface-visibility属性可以设置当元素不面向屏幕时是否可见。

本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。

CSS3 backface-visibility属性

backface-visibility 属性定义当元素背面向屏幕时是否可见。

如果在旋转元素不希望看到其背面时，该属性很有用。

语法

1	`backface-visibility:` `visible\|hidden;`

属性值：

backface-visibility属性和3D transform效果相关，它用于决定当一个元素的背面面向用户的时候是否可见。例如下面图片展示的两个圆形元素，前面一个是正面，后面一个是背面。当它翻转到背面的时候，上面的文字应该是正面的镜像，这是默认的行为。

当使用backface-visibility: hidden;样式后，另一幅代表背面的图片来取代原来的背面

【推荐教程：CSS视频教程】

浏览器兼容

所有的现代浏览器都支持backface-visibility属性。Chrome、Safari和Opera浏览器需要使用-webkit-的厂商前缀。IE10+的IE浏览器都支持该属性。

示例：旋转的甜甜圈

阅读剩余部分

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者