Bulma es un marco CSS gratuito y de código abierto basado en Flexbox. Es rico en componentes, compatible y está bien documentado. Es de naturaleza altamente receptiva. Utiliza clases para implementar su diseño.
El componente Bulma Message se usa para proporcionar bloques de mensajes de colores para enfatizar parte de la página. Es un componente multiparte. El cuerpo del Mensaje es uno de los componentes del marco del Mensaje de Bulma.
Clase de cuerpo del mensaje de Bulma:
- cuerpo del mensaje: esta clase se utiliza para crear el cuerpo del mensaje del contenedor del mensaje.
Sintaxis:
<div class="message-body">
<!-- Message body content -->
</div>
El siguiente ejemplo ilustra el cuerpo del mensaje de Bulma:
Ejemplo:
HTML
<!DOCTYPE html> <html> <head> <title>Bulma Message Body only</title> <!-- Include Bulma CSS --> <link rel='stylesheet' href= 'https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.5/css/bulma.css'> <!-- FontAwesome Library --> <script src= 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0-2/js/all.min.js'> </script> </head> <body> <div class='content container has-text-justified'> <div class='columns is-mobile is-centered'> <div class='column is-4'> <h1 class="has-text-success has-text-centered"> GeeksforGeeks </h1> <h3 class="has-text-centered"> Bulma Message Body only </h3> <article class="message"> <div class="message-body"> <strong>'GeeksforGeeks'</strong> is a computer science portal.it was created with a goal in mind to provide well written, well thought and well explained solutions for selected questions. The core team of five super geeks constituting of technology lovers and computer science enthusiasts have been constantly working in this direction. </div> </article> </div> </div> </div> </body> </html>
Producción:
Cuerpo del mensaje de Bulma
Referencia: https://bulma.io/documentation/components/message/#message-body-only