Skip to main content

Background Image

img

Usage​

import React from 'react';
import { BackgroundImage } from 'qdm-component-library';

function App() {
  return (
      <BackgroundImage
        url="/images/icons/96x96.png"
        backgroundSize="contain"
    >
   );
}
export default App;

Reference​

url​

The URL to the image string

backgroundPosition​

Specifies the position of the background images string

backgroundPositionX​

Specifies the position X of the background images string

backgroundPositionY​

Specifies the position Y of the background images string

backgroundRepeat​

Specifies how to repeat the background images string

backgroundRepeatX​

Specifies how to repeat the background images in X position string

backgroundRepeatY​

Specifies how to repeat the background images in Y position string

backgroundAttachment​

Specifies whether the background images are fixed or scrolls with the rest of the page string

backgroundSize​

Specifies the size of the background images string

backgroundOrigin​

Specifies the positioning area of the background images string

children​

props for providing children for BackgroundImage component React Node

inLineStyles​

props for providing extra styling object