## transform-style (_base.scscs)

### Tipo: Mixin

### Versión: 1.1.13

Clase vendor existente dentro de SISASS para la propiedad transform style

La propiedad transform-style es una propiedad de CSS que establece si el elemento hijo está posicionado en el espacio tridimensional (preserve-3d) o si se integra en el plano del elemento padre (flat). De esta manera, podemos controlar cómo se comportan los elementos hijos en relación con el elemento padre cuando se aplican transformaciones tridimensionales.

## Interface

    @mixin transform-style($br: none);

br: Valor a asignar a la propiedad

## Propiedad transform-style con preserve-3d

## Ejemplo 1: SCSS

## Ejemplo 1: CSS generado

## Ejemplo 1: HTML

    <div class="transform_style_preserve_3d center_element">
         <p class="text">Padre</p>
         <div class="children center_element">
             <p class="text">
                 Hijo
             </p>
         </div>
     </div>

## Resultado

Padre

Hijo

## Propiedad transform-style con flat

## Ejemplo 2: SCSS

## Ejemplo 2: CSS generado

## Ejemplo 2: HTML

    <div class="transform_style_flat center_element">
         <p class="text">Padre</p>
         <div class="children center_element">
             <p class="text">
                 Hijo
             </p>
         </div>
     </div>

## Resultado

Padre

Hijo

## Cubo 3D realizado con la propiedad transform-style

## Ejemplo 3: SCSS

## Ejemplo 3: CSS generado

## Ejemplo 3: HTML

    <div class="cube_transform_style">
         <div class="face front">1</div>
         <div class="face back">2</div>
         <div class="face right">3</div>
         <div class="face left">4</div>
         <div class="face top">5</div>
         <div class="face bottom">6</div>
     </div>

## Resultado

1
2
3
4
5
6