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 various different elements to use to make your website look more amazing. Semantic UI provides us with a very easy way to style images. It offers images of different types like a normal image and image link. It also provides us with different states like hidden, visible, and also in different variations and states.
In this article, we are going to learn about Semantic-UI Image Types and their implementation using example code.
Semantic-UI Image Type:
1. Image: It is used to insert normal image to the document. The image usually takes the shape of the container, but if specific dimensions are given, the image will take the dimensions specified.
<div class="ui small image">
Example 2: Let us now specify the dimensions of the image in these examples.
2. Image Link: If the image is clicked, you will be redirected to the site which is linked. It is formatted in such a way that it is linked with other content.
<a href="...." class="ui medium image">