<!DOCTYPE html>
<
html
>
<
head
>
<
title
>Semantic-UI Statistics Variations</
title
>
<
link
rel
=
"stylesheet"
href
=
</
head
>
<
body
>
<
div
class
=
"ui container"
>
<
br
/><
br
/>
<
h2
class
=
"ui header green"
>GeeksforGeeks</
h2
>
<
b
>
<
p
>Semantic UI Statistics Variations</
p
>
</
b
>
<
hr
><
br
/>
<
span
>Horizontal Statistic : </
span
>
<
div
class
=
"ui horizontal statistic"
style
=
"margin-right:120px"
>
<
div
class
=
"value"
>
1
</
div
>
<
div
class
=
"label"
>
Label 1
</
div
>
</
div
>
<
span
>Colored Statistic : </
span
>
<
div
class
=
"ui green statistic"
>
<
div
class
=
"value"
>
2
</
div
>
<
div
class
=
"label"
>
Label 2
</
div
>
</
div
>
<
div
class
=
"ui red statistic"
>
<
div
class
=
"value"
>
3
</
div
>
<
div
class
=
"label"
>
Label 3
</
div
>
</
div
>
<
div
class
=
"ui orange statistic"
>
<
div
class
=
"value"
>
4
</
div
>
<
div
class
=
"label"
>
Label 4
</
div
>
</
div
>
<
br
/>
<
div
class
=
"ui inverted segment"
>
<
p
>Inverted Statistic : </
p
>
<
div
class
=
"ui inverted statistic"
>
<
div
class
=
"value"
>
5
</
div
>
<
div
class
=
"label"
>
Label 5
</
div
>
</
div
>
<
div
class
=
"ui green inverted statistic"
>
<
div
class
=
"value"
>
6
</
div
>
<
div
class
=
"label"
>
Label 6
</
div
>
</
div
>
<
div
class
=
"ui inverted statistic"
>
<
div
class
=
"value"
>
7
</
div
>
<
div
class
=
"label"
>
Label 7
</
div
>
</
div
>
</
div
>
<
br
/>
<
p
>Evenly Divided Statistic : </
p
>
<
div
class
=
"ui four statistics"
>
<
div
class
=
"statistic"
>
<
div
class
=
"value"
>
8
</
div
>
<
div
class
=
"label"
>
Label 8
</
div
>
</
div
>
<
div
class
=
"statistic"
>
<
div
class
=
"value"
>
9
</
div
>
<
div
class
=
"label"
>
Label 9
</
div
>
</
div
>
<
div
class
=
"statistic"
>
<
div
class
=
"value"
>
10
</
div
>
<
div
class
=
"label"
>
Label 10
</
div
>
</
div
>
<
div
class
=
"statistic"
>
<
div
class
=
"value"
>
11
</
div
>
<
div
class
=
"label"
>
Label 11
</
div
>
</
div
>
</
div
>
<
br
/>
<
span
>Floated Statistic : </
span
>
<
div
class
=
"ui segment"
>
<
div
class
=
"ui left floated statistic"
>
<
div
class
=
"value"
>
12
</
div
>
<
div
class
=
"label"
>
Floated
</
div
>
</
div
>
<
p
>As the placement season is back,
GeeksforGeeks is here to help you
crack the interview. We have selected
some most commonly asked and MUST DO
practice problems to crack Product-based
Company Interviews.You can also take part
in our mock placement contests which will
help you learn different topics and
practice at the same time, simulating the
feeling of a real placement test
environment.
</
p
>
</
div
>
<
br
/>
<
span
>Size Statistic : </
span
>
<
div
class
=
"ui mini statistic"
>
<
div
class
=
"value"
>
13
</
div
>
<
div
class
=
"label"
>
Mini
</
div
>
</
div
>
<
div
class
=
"ui small statistic"
>
<
div
class
=
"value"
>
14
</
div
>
<
div
class
=
"label"
>
Small
</
div
>
</
div
>
<
div
class
=
"ui large statistic"
>
<
div
class
=
"value"
>
15
</
div
>
<
div
class
=
"label"
>
Large
</
div
>
</
div
>
</
div
>
</
body
>
</
html
>