Miniatura vs fondo: como elegir – ZenBlocks buttonBasic
Conclusion
La **miniatura** es una imagen independiente dentro del boton. El **fondo** cubre todo el boton por detras del contenido.
—
Comparacion
| Criterio | Miniatura | Fondo |
|—|—|—|
| Posicion | Dentro del boton | Fondo global del boton |
| Relacion con texto | Lado a lado o arriba/abajo | Texto encima |
| Tamano | `Ancho`/`Alto` dedicados | `Background Tamaño` |
| Hover | Cambios de tamano/posicion | Cambios por overlay/color |
| Video | No | Si |
| Superposición | No | Si |
| Borde radius | Propio | Normalmente sigue el boton |
| Responsive | Ajustable por dispositivo | Ajustable por dispositivo |—
Criterios de uso
### Usa miniatura cuando
1. Necesitas mostrar producto/logo concreto.
2. Quieres composicion texto + imagen.
3. Quieres estilo propio en la imagen.
4. Quieres zoom de imagen en hover.### Usa fondo cuando
1. Quieres crear ambiente general del boton.
2. Colocas texto sobre foto con overlay.
3. Necesitas video de fondo.
4. Quieres diferencias entre `Predeterminado/Hover`.### Usar ambos
Es posible combinar:
– fondo para ambiente,
– miniatura para visual principal,
– texto CTA para accion.—
Puntos de atencion
– Miniatura usa `object-fit`; puede recortar.
– Superposición demasiado opaco puede ocultar el fondo.
– Medios pesados afectan rendimiento.—
Ajustes relacionados
– [Configuración de miniatura](../thumbnail/)
– [Configuración de fondo](../background/)
– [Configuración de diseño](../layout/)