CSS Property backface-visibility

The backface-visibility property determines whether or not or not the “back” facet of a remodeled part is visible once facing the viewer.

The back face of a component sometimes encompasses a clear background, letting, once visible, a reflection of the front face be displayed.

It is employed in conjunction with CSS transforms once a component is revolved in three-dimensional area so its front face now not faces towards the screen, and its back face is facing it instead. for instance, applying a rotation regarding the coordinate axis of 180° (for instance) would cause the rear facet of the part to face the viewer. it’s no result on two-dimensional transforms.

This property is helpful after you place 2 parts succeeding, as you’d to form a card. once the cardboard is flipped, you wouldn’t need the content of the front face to be visible through the rear face. while not this property, the front Associate in Nursingd back parts might switch places occasionally throughout an animation to flip the cardboard. it’s conjointly helpful once making cubes within the three-dimensional area. See the Live Demo section below for a live example.

CSS Property backface-visibility Value

  • visible
  • hidden

visible

Indicates that the rear face of the part is visible, and therefore the front face shows through it.

hidden

Indicates that the rear face is hidden and so the front face doesn’t show through.

Desktop Browser Support

Mobile Browser Support

Leave a Reply