Image
Welcome to Docy ! Documentation and examples for typography, including global settings, headings, body text, lists, and more.
Image with Caption
Images in Bootstrap are made responsive with .img-fluid
. max-width: 100%;
and height: auto;
are applied to the image so that it scales with the parent element.
<figure>
<img src="img/blog-single/single_post_img_two.jpg" class="img-fluid" alt="image with caption">
<figcaption>This is the image caption text.</figcaption>
</figure>
Image Magnify
We designed Docy for the readers, optimizing not for page views or engagement — but reading. And it turns out that context is a vital part of learning.
<a href="img/img-large.jpg">
<img class="img-fluid zoom" src="img/img-large.jpg" alt="large">
</a>
Images Shapes
Easily create images in different shapes with adding one class to the <img> tag.
<img src="..." class="rounded" alt="Round image" >
<img src="..." class="rounded-circle" alt="Circle image" >
<img src="..." class="img-thumbnail" alt="Thumbnail" >
Aligning images
Align images with the helper float classes or text alignment classes. block
-level images can be centered using the .mx-auto
margin utility class.
<div class="overflow-hidden mb-20">
<img src="assets/images/thumb/l-1.jpg" class="rounded float-left" alt="...">
<img src="assets/images/thumb/l-2.jpg" class="rounded float-right" alt="...">
<div>
<div class="overflow-hidden mb-20">
<img src="assets/images/thumb/l-1.jpg" class="rounded mx-auto d-block" alt="...">
<div>
<div class="text-center mb-20">
<img src="assets/images/thumb/l-1.jpg" class="rounded" alt="...">
<div>
3 Comment
Issac Wise
Wouldn’t it be better practice to use get_the_title(..) in this case? directly accessing the post object’s data member would bypass applying filters and enforcing protected and private settings, unless that’s explicitly desired.
ReplyHans Down
Thenks Demo User for Wouldn’t it be better practice to use get_the_title.
ReplyHans Down
Dropped a clanger up the kyver easy peasy vagabond victoria sponge Charles tinkety tonk old fruit argy.!
ReplyChauffina Carr
Wouldn’t it be better practice to use get_the_title(..) in this case? directly accessing the post object’s data member would bypass applying filters and enforcing protected and private settings, unless that’s explicitly desired.
Reply