Semantic-UI Card Approval Content
Semantic UI is an open-source framework that uses CSS and jQuery to build great user interfaces. It is the same as a bootstrap for use and has great different elements to use to make your website look more amazing and responsive.
The semantic UI Card element displays site content in a manner similar to a playing card using the Semantic UI classes. Semantic UI cards have multiple sections such as content, extra-content, approval, and description. In this article, we will learn about the Approval block of the Semantic UI card.
Semantic UI card approval block contains a like or star action. This helps users to show approval or disapproval of the content. To add an approval block to the Card in semantic UI, we use the icon and shape classes. In a single card, there can be multiple approval blocks.
Semantic-UI Card Approval Block Class:
- icon: This class is used to add icons provided by semantic UI.
- star/heart: this class is used to add either the heart icon or the star icon.
<div class="ui card"> <i class="right/left floated star/heart icon"></i> </div>
Example 1: The following example demonstrates the approval block of the semantic UI card with a like button.
Example 2: The following example demonstrates the approval block of the semantic UI card with the top floated star and like button.
Please Login to comment...