Category / Section
How to set background image for Sidebar?
1 min read
How to add background image for EJ2 Sidebar control.
Solution
We can set the background image for Sidebar control using CSS styles. Please refer to the below code block.
/* sidebar styles*/
#default-sidebar {
background-color: #224562;
color: #224562;
background- image: url(https://mdbootstrap.com/img/Photos/Others/sidenav4.jpg);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border:none;
}
Refer to the below screenshot of output of the Sidebar with background image.
|
Sample link: https://stackblitz.com/edit/sidebar-bgimage
Documentation: https://ej2.syncfusion.com/documentation/sidebar/getting-started/
CSS structure: https://ej2.syncfusion.com/documentation/sidebar/style/
API reference: https://ej2.syncfusion.com/documentation/api/sidebar/
Live demo: https://ej2.syncfusion.com/demos/#/material/sidebar/default.html
