Semantic-UI Advertisement Variations
Semantic UI is a modern framework used in developing seamless designs for the website, It gives the user a lightweight experience with its components. It uses the predefined CSS and jQuery to incorporate in different frameworks.
Semantic UI Advertisement offers us 2 variations of advertisement Centered and Test. In this article, we will know about them briefly.
Semantic UI Advertisement Variations:
- Centered: This variation is used to make centered space for ad.
- Test: This variation is used to make a rectangle-sized test ad.
Syntax:
<div class="ui Advertisement-Variations test ad"> ... </div>
Below examples illustrate the Semantic UI Advertisement Variations:
Example 1: In this example we will see the Centered variations advertisement.
HTML
<!DOCTYPE html><html><head> <title>Semantic UI Advertisement Centered Variation</title> <link href= rel="stylesheet" /></head><body> <center> <h1 class="ui header green">GeeksforGeeks</h1> <strong> Semantic UI Advertisement Centered Variation </strong> </center> <div class="ui centered banner test ad"> </div></body></html> |
Output:
Semantic UI Advertisement Variations
Example 2: In this example, we will see the Test variations advertisement.
HTML
<!DOCTYPE html><html> <head> <title>Semantic UI Advertisement Test Variation</title> <link href= rel="stylesheet" /></head> <body> <center> <h1 class="ui header green"> GeeksforGeeks </h1> <strong>Semantic UI Advertisement Test Variation</strong> </center> <div class="ui small rectangle test ad" data-text="Advertisement Test Variation"> </div></body> </html> |
Output:
Semantic UI Advertisement Variations
Reference: https://semantic-ui.com/views/advertisement.html
Please Login to comment...