Ionic full screen background image
Ionic full screen background image : In ionic framework full screen background image can be added using css. Here in this tutorial we are going to explain how to add full screen background image in ionic framework with example and demo.
Ionic full screen background image
You can add the full background image in ionic framework simply adding the class .pane in ionic view and add the background image to this class as below-
Ionic full screen background image Example & Demo:
<ion-view view-title="My Page" class="pane"> <ion-content> Hello World! </ion-content> </ion-view> <style type="text/css"> .pane{ background:url('http://tutorialsplane.com/wp-content/uploads/2016/02/1511516_1035103706511033_695479665952545706_n.jpg') no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; } </style> |
If you run the above example it will produce the following output –
Advertisements