---
title: Panels
localeTitle: Los paneles
---
## Los paneles

El marco de Bootstrap le proporciona una característica llamada paneles. Un panel es un cuadro que tiene un encabezado con estilo y luego un cuerpo que le permite mostrar información de manera organizada, a través de un conjunto de uno o más paneles.

#### Cómo utilizar:

Para usar Bootstrap Panels, agregue un `<div>` con una clase para su tipo de panel (panel de clase `panel panel-default` o algo similar, vea los ejemplos del panel para obtener más información) y luego dos etiquetas `<div>` anidadas, una para el encabezado ( `panel panel-heading` clase `panel panel-heading` ) y uno para el cuerpo ( `panel panel-body` clase `panel panel-body` ). Puede encontrar que el Ejemplo de Código es más fácil de entender que una explicación por escrito.

**Ejemplo de código**

```html

<div class="panel panel-primary"> 
  <div class="panel panel-heading">Panel Primary</div> 
  <div class="panel panel-body"> This is a panel with the primary panel style.</div> 
 </div> 
```

#### Ejemplos de paneles:

Este es un conjunto de ejemplos que muestra cada tipo de panel. La clase CSS se muestra sobre cada ejemplo.

`panel panel-default`

Panel por defecto

Este es un panel con el estilo de panel predeterminado.

`panel panel-primary`

Panel primario

Este es un panel con el estilo del panel primario.

`panel panel-success`

Panel de exito

Este es un panel con el estilo de panel de éxito.

`panel panel-info`

Información del panel

Este es un panel con el estilo de panel de información.

`panel panel-warning`

Advertencia del panel

Este es un panel con el estilo de panel de advertencia.

`panel panel-danger`

Panel de peligro

Este es un panel con el estilo de panel de peligro.

### Más información

*   [Documentación desplegable de Bootstrap](https://getbootstrap.com/docs/4.0/components/dropdowns/)