Semantic-UI Placeholder Lines 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. Semantic UI Placeholder offers us 4 types of content – lines, header, paragraph, and images. 

In this article, we will learn about the Semantic UI Placeholder Lines content. Semantic UI Placeholder Lines Content is used so the placeholder can contain have lines of text

Semantic-UI Placeholder Lines Content Class:

• line: This class is used to create lines as a placeholder.

Syntax:

<div class="ui placeholder">
      <div class="line"></div>
      <div class="line"></div>
    ...
</div>

The below example illustrates the Semantic-UI Placeholder Lines Content:

Example 1: In this example, we will put two lines placeholder.

Output:

Semantic-UI Placeholder Lines Content

Example 2: In this example, we will use multiple lines placeholder, notice one thing if we use br tag then the line will become a paragraph and looks like a section is placed as a placeholder.

Output:

Semantic-UI Placeholder Lines Content

Reference: https://semantic-ui.com/elements/placeholder.html#lines