{Theme} has three versions of person box.
CSS classes:
.ct-personBox
.ct-personBox–withHover
.ct-personBox–titleTop
Default person box
Screenshot:
Markup:
1 2 3 4 5 6 |
<div class="ct-personBox"> <div class="ct-personBox-image"><img src="assets/images/demo-content/personBox.jpg" alt="person"></div> <div class="ct-personBox-description"> <h5 class="ct-personBox-title">Kareb Dhonson</h5><span class="ct-personBox-meta">The ceo</span> </div> </div> |
Tite top person box
Screenshot:
Markup:
1 2 3 4 5 6 7 |
<div class="ct-personBox ct-personBox--titleTop"> <div class="ct-personBox-image"><img src="assets/images/demo-content/personBox-testimonials.jpg" alt="person"></div> <div class="ct-personBox-description"> <h5 class="ct-personBox-title">gabrielle memphis</h5> <p>My friends couldn't believe the price. The hotels were top of the line, and our guide was great. </p> </div> </div> |
Person box with hover
Screenshot:
Markup:
1 2 3 4 5 6 |
<div class="ct-personBox ct-personBox--withHover"> <div class="ct-personBox-image"><img src="assets/images/demo-content/todo1.jpg" alt="person"></div> <div class="ct-personBox-description"> <h5 class="ct-personBox-title">Colosseum</h5><span class="ct-personBox-meta">3 tours</span><a href="#" class="btn btn-primary btn-xs text-uppercase">read more</a> </div> </div> |