Picture

This is a very simple component, containing a picture.

Default

px 

			
				<picture class="a-picture ">
	<img class="a-picture__image" src="/assets/images/mock/iphone.jpg" alt="Bebat" title="Bebat" />
</picture>

Hero

px 

			
				<picture class="a-picture a-picture--hero">
	<img class="a-picture__image" src="/assets/images/mock/iphone.jpg" alt="Bebat" title="Bebat" />
</picture>

Documentation

Modifiers

  • a-picture--hero

    This class is used to use a picture as a hero.

  • a-picture--cover

    This class is used to fill the container item completly with a picture.