Bulma Message Body
Last Updated :
30 Jan, 2022
Bulma is a free, open-source CSS framework based on Flexbox. It is component-rich, compatible, and well documented. It is highly responsive in nature. It uses classes to implement its design.
The Bulma Message component is used to provide the colored message blocks to emphasize part of the page. It is a multipart component. The Message body is one of the components of the Bulma Message framework.
Bulma Message Body class:
- message-body: This class is used to create the message body of the message container.
Syntax:
<div class="message-body">
<!-- Message body content -->
</div>
Below example illustrate the Bulma Message body:
Example:
HTML
<!DOCTYPE html>
< html >
< head >
< title >Bulma Message Body only</ title >
< link rel = 'stylesheet'
href =
< script src =
</ 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 >
|
Output:
Bulma Message body
Reference: https://bulma.io/documentation/components/message/#message-body-only
Share your thoughts in the comments
Please Login to comment...