Img
Image component.
Usage
Example
Script
return ( <CImg src="https://picsum.photos/1024/480/?image=54" fluid className="mb-2" /> )# Features
- Easy styling
- Show coloured or transparent blank image (svg) if source of image is not defined. Component can be used as blank svg image permanently or until source of image is passed
# Img API
| Name | Required | Type | Default Value |
|---|---|---|---|
| tag | any | ||
| main HTML tag name | |||
| className | (string | any[]) | ||
| user classes for the main HTML tag | |||
| innerRef | (object | Function | string) | ||
| ref to the main tag | |||
| src | string | ||
| src prop | |||
| width | (number | string) | ||
| width of the image | |||
| height | (number | string) | ||
| height of the image | |||
| block | boolean | ||
| sets display value of element to block | |||
| fluid | boolean | ||
| sets fluid mode | |||
| fluidGrow | boolean | ||
| sets minimum width to w-100 | |||
| shape | string | ||
| image shape css class, example available classes: 'rounded': slightly rounded corners, 'rounded-top': top corners rounded, 'rounded-right': right corners rounded, 'rounded-bottom': bottom corners rounded, 'rounded-left': left corners rounded, 'rounded-circle': circle/oval | |||
| thumbnail | boolean | ||
| sets thumbnail mode | |||
| align | (left | right | center) | ||
| horizontal alignment | |||
| placeholderColor | string | transparent | |
| background color | |||