README - Mjml — ContextQMD

mj-image

Displays a responsive image in your email. It is similar to the HTML `` tag.

Note that if no width is provided, the image will use the parent column width.

xml

<mjml>
  <mj-body>
    <mj-section>
      <mj-column>
        <mj-image width="300px" src="https://static.mailjet.com/mjml-website/documentation/image.png" />
      </mj-column>
    </mj-section>
  </mj-body>
</mjml>

Attributes

attribute	accepts	description	default value
align	`left` `center` `right`	image alignment	`center`
alt	string	image description	`''`
border	string	CSS border format	`0`
border-bottom	string	CSS border format
border-left	string	CSS border format
border-radius	string	border radius
border-right	string	CSS border format
border-top	string	CSS border format
container-background-color	CSS color formats	inner element background color
css-class	string	class name, added to the root HTML element created
fluid-on-mobile	boolean	if `true`, will be full width on mobile even if `width` is set
font-size	`px`	size of the alt text when image is not rendered	`13px`
height	`px`	image height	`auto`
href	string	link to redirect to on click, in URL format
max-height	`px` `%`	specify the maximum height of an image
name	string	specify the link name attribute
padding	`px` `%`	hero padding, supports up to 4 parameters	`10px 25px`
padding-bottom	`px` `%`	hero bottom padding
padding-left	`px` `%`	hero left padding
padding-right	`px` `%`	hero right padding
padding-top	`px` `%`	hero top padding
rel	string	specify the rel attribute
sizes	string	set width based on query
src	string	image source in URL format
srcset	string	enables to set a different image source based on the viewport, using CSS syntax
target	string	link target on click	`_blank`
title	string	tooltip & accessibility
usemap	string	reference to image map, be careful, it isn't supported everywhere
width	`px`	image width	inherits parent width