Semantic-UI Segment Loading State
The Semantic UI is an open-source framework that provides a segment or portion on a webpage that is used to create a group of related content. It is very similar to bootstrap usage and has different elements to make your website more amazing using jQuery and CSS for interfaces. For the styling of elements, it uses classes.
A Segment is used to create a grouping of related content. Semantic UI provides classes for styling the segment element. There are two states of the segment in Semantic UI, i.e. disabled and loading. In this article, we will learn about the loading state of the segment in the Semantic UI.
In the Loading state, a segment shows that its content is being loaded. An animated loader is shown on top of the segment to denote this. Semantic UI uses the loading class to convert a basic segment into a loading segment. We use the .ui and the .segment classes of Semantic UI for creating a normal segment.
Semantic UI Segment Loading State Class:
- loading: The class converts a basic segment in Semantic UI to a loading state segment.
<div class="ui loading segment"> </div>
Example 1: This example demonstrates the loading state of the basic segment in Semantic UI.
Example 2: This example demonstrates the loading state of the inverted segment in Semantic UI.
Please Login to comment...