Ionic Setting Background Image For Page
up vote
1
down vote
favorite
I am fairly new to Ionic and I am trying to use a gradient image as my background on the welcome page of my application. I am able to load images on different pages of my app from the same assets/imgs folder, but not on the welcome page. If I set the background to a plain color it works like a charm. Any tips?
Error Message: Failed to load resource: the server responded with a status of 404 (Not Found)
page-welcome {
#welcome{
// background: color($colors, dark);
background-image: url("assets/imgs/gradient.jpg");
h1{
font-size: 52px;
margin-top:50px
}
.marginTop{
margin-top:150px;
}
.logo{
height: 100px;
}
}
}
html css ionic-framework
edited Nov 12 at 17:30
kit
616116
asked Nov 12 at 16:07
Kayla
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
add a comment |
up vote
1
down vote
favorite
I am fairly new to Ionic and I am trying to use a gradient image as my background on the welcome page of my application. I am able to load images on different pages of my app from the same assets/imgs folder, but not on the welcome page. If I set the background to a plain color it works like a charm. Any tips?
Error Message: Failed to load resource: the server responded with a status of 404 (Not Found)
page-welcome {
#welcome{
// background: color($colors, dark);
background-image: url("assets/imgs/gradient.jpg");
h1{
font-size: 52px;
margin-top:50px
}
.marginTop{
margin-top:150px;
}
.logo{
height: 100px;
}
}
}
html css ionic-framework
edited Nov 12 at 17:30
kit
616116
asked Nov 12 at 16:07
Kayla
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
add a comment |
up vote
1
down vote
favorite
up vote
1
down vote
favorite
I am fairly new to Ionic and I am trying to use a gradient image as my background on the welcome page of my application. I am able to load images on different pages of my app from the same assets/imgs folder, but not on the welcome page. If I set the background to a plain color it works like a charm. Any tips?
Error Message: Failed to load resource: the server responded with a status of 404 (Not Found)
page-welcome {
#welcome{
// background: color($colors, dark);
background-image: url("assets/imgs/gradient.jpg");
h1{
font-size: 52px;
margin-top:50px
}
.marginTop{
margin-top:150px;
}
.logo{
height: 100px;
}
}
}
html css ionic-framework
edited Nov 12 at 17:30
kit
616116
asked Nov 12 at 16:07
Kayla
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
I am fairly new to Ionic and I am trying to use a gradient image as my background on the welcome page of my application. I am able to load images on different pages of my app from the same assets/imgs folder, but not on the welcome page. If I set the background to a plain color it works like a charm. Any tips?
Error Message: Failed to load resource: the server responded with a status of 404 (Not Found)
page-welcome {
#welcome{
// background: color($colors, dark);
background-image: url("assets/imgs/gradient.jpg");
h1{
font-size: 52px;
margin-top:50px
}
.marginTop{
margin-top:150px;
}
.logo{
height: 100px;
}
}
}
html css ionic-framework
html css ionic-framework
edited Nov 12 at 17:30
kit
616116
asked Nov 12 at 16:07
Kayla
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
edited Nov 12 at 17:30
kit
616116
asked Nov 12 at 16:07
Kayla
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
edited Nov 12 at 17:30
kit
616116
edited Nov 12 at 17:30
kit
616116
edited Nov 12 at 17:30
kit
616116
616116
asked Nov 12 at 16:07
Kayla
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
asked Nov 12 at 16:07
Kayla
62
asked Nov 12 at 16:07
Kayla
62
62
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
New contributor
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
Kayla is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
try with a relative path:
background-image: url("../../assets/imgs/gradient.jpg");
answered Nov 12 at 19:41
hectorob91
463
1
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
try with a relative path:
background-image: url("../../assets/imgs/gradient.jpg");
answered Nov 12 at 19:41
hectorob91
463
1
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
add a comment |
up vote
0
down vote
try with a relative path:
background-image: url("../../assets/imgs/gradient.jpg");
answered Nov 12 at 19:41
hectorob91
463
1
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
add a comment |
up vote
0
down vote
up vote
0
down vote
try with a relative path:
background-image: url("../../assets/imgs/gradient.jpg");
answered Nov 12 at 19:41
hectorob91
463
try with a relative path:
background-image: url("../../assets/imgs/gradient.jpg");
answered Nov 12 at 19:41
hectorob91
463
answered Nov 12 at 19:41
hectorob91
463
answered Nov 12 at 19:41
hectorob91
463
answered Nov 12 at 19:41
hectorob91
463
463
1
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
add a comment |
1
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
1
1
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
This does not provide an answer to the question. Once you have sufficient reputation you will be able to comment on any post; instead, provide answers that don't require clarification from the asker. - From Review
– OznOg
Nov 12 at 20:32
add a comment |
Kayla is a new contributor. Be nice, and check out our Code of Conduct.
Kayla is a new contributor. Be nice, and check out our Code of Conduct.
Kayla is a new contributor. Be nice, and check out our Code of Conduct.
Kayla is a new contributor. Be nice, and check out our Code of Conduct.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53265944%2fionic-setting-background-image-for-page%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
