A criação de um widget de cartão flip Bootstrap envolve o uso da frente e de trás de uma estrutura semelhante a um cartão. Veja como você pode criar um:

Estrutura HTML :

```html

```

Estilo CSS :

```css
.flip-card {
largura:250px;
altura:250px;
perspectiva:1000px; /* Cria um efeito 3D */
}

.flip-card-inner {
posição:relativa;
largura:100%;
altura:100%;
alinhamento de texto:centro;
transição:transformação 0,8s;
estilo de transformação:preserve-3d;
}

.flip-card-front,
.flip-card-back {
posição:absoluta;
largura:100%;
altura:100%;
visibilidade backface:oculta;
}

.flip-card-back {
transformar:girarY(180deg);
}
```

Interação com JavaScript:

Para ativar a funcionalidade flip, você pode usar ouvintes de eventos JavaScript (por exemplo, ao clicar no mouse) e manipular a propriedade `transform` do elemento `.flip-card-inner` para fazer a transição entre a frente e o verso do cartão.

Por exemplo, veja como você poderia implementar a funcionalidade flip usando jQuery:

```javascript
$(documento).ready(() => {
$(".flip-card").on("clique", function () {
$(this).find(".flip-card-inner").toggleClass("flipped");
});
});
```

Este código JavaScript escuta cliques no elemento `.flip-card` e alterna a classe `flipped` no elemento `.flip-card-inner`. A classe `flipped` pode ser definida em CSS para realizar a animação flip.

Combinando a estrutura HTML, o estilo CSS e a interação JavaScript, você pode criar um widget de cartão flip Bootstrap que permite aos usuários alternar entre a frente e o verso do cartão.