background image is not appearing in the ionic viewe nor in the compiled app

0

Background image is not appearing in the ionic viewe or compiled app.

When I put it to appear right in hmtl like this:

style="background-image:url(../img/santa-filomena3.jpg); background-size: cover;
     background-position: center;"

The background image appeared in the browser, but the ionic view and compiled app did not appear.

Has anyone ever had this problem?

As it was not working in the browser I created it in css, but I could not make it work yet.

Style.css

.ion-content teste{
     background-image: url(.../img/fundo.jpg); 
     background-size: cover;
     background-position: center;
}

main.html

<ion-view view-title="Home">
  <ion-content class="padding"  
               id="teste">

        <div class="row responsive-lg">
              <div class="row">
                <div class="col" >
                  <span><a href="#/app/missa">Missa</a></span>
                </div>
                <div class="col">
                  <span><a href="#/app/doacao">Doação</a></span>
                </div> 
              </div>
              <div class="row">
                <div class="col" >
                  <span><a href="#/app/confissao">Confissão</a></span>
                </div>
                <div class="col">
                 <span><a href="#/app/santaFilomena">Santa Filomena</a></span>
                </div>
              </div>
              <div class="row">
                <div class="col">
                 <span><a href="#/app/secretaria">Fale Conosco</a></span>
                </div>
              </div>
              <div class="row">
                <div class="col">
                  <span><a href="#/app/site">Site</a></span>
                </div> 
              </div>

        </div>

    </ion-content>
</ion-view>

Could someone help me?

    
asked by anonymous 10.04.2017 / 20:46

1 answer

0

I managed to fix it. css

.principal-custom {
     background-color: #FF4500;
     background-image: url(../img/fundo.jpg); 
     background-size: cover;
     background-position: center;
}

main.html

<ion-view view-title="Home">
  <ion-content class="principal-custom">
          <div>
              <div class="row">
                <div class="col" >
                  <span><a href="#/app/missa">Missa</a></span>
                </div>
                <div class="col">
                  <span><a href="#/app/doacao">Doação</a></span>
                </div> 
              </div>
              <div class="row">
                <div class="col" >
                  <span><a href="#/app/confissao">Confissão</a></span>
                </div>
                <div class="col">
                 <span><a href="#/app/santaFilomena">Santa Filomena</a></span>
                </div>
              </div>
              <div class="row">
                <div class="col">
                 <span><a href="#/app/secretaria">Fale Conosco</a></span>
                </div>
              </div>
              <div class="row">
                <div class="col">
                  <span><a href="#/app/site">Site</a></span>
                </div> 
              </div>

        </div>

    </ion-content>
</ion-view>
    
10.04.2017 / 21:34