This article offers some use cases for showing how to resize and align images.
Resizing Images
We use the URL query of image for resizing images. For example:
Specify the width and preserve ratio
1
Specify the height and preserve ratio
1
Specify the width and height
1
It can be used not only for page resources , but also for the static images and external images. However, in addition to page resources, others are resized by inline style, that is, their original size will not change.
Aligning Images
We can easily align images by adding URL fragments. Such as #center, #floatleft and #floatright represents align center, float left and float right respectively.
Center
Adding the #center fragment for aligning images to the center.
For example: .
Float Left
Adding the #floatleft fragment for floating images to the left.
For example: .
Float Right
Similarly, we can also float images to the right by adding the #floatright fragment.
For example: .
