background-image Property of Css is not working
Question
directory:
index.html
Images
(inside Images folder) Logo.png
CSS
.landing-page_logo{ display: block; background-image: url("Images/Logo.png"); width: 300px; height: 300px; background-size: cover; }
<section class="landing-page"> <div class="landing-page_logo"> </div> <h3>Welcome</h3> <h4>This is ......</h4> <div> Animated Text header </div> </section>
Image is in correct folder. Tried using <img> tag and that was working. But background-image tag is not working
2 answers
solution1
3 2020-01-12 16:53:07
If you have your images within folders then try this background-image: url(/resources/Images/Logo.jpg); don't forget to put backslash in front of the first folder.
solution2
1 2020-01-12 16:55:31
Make sure you include the link to the css stylesheet.
Your html should look something like this:
<html>
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<section class="landing-page">
<div class="landing-page_logo"></div>
<h3>Welcome</h3>
<h4>This is ......</h4>
<div>
Animated Text header
</div>
</section>
</body>
</html>
Of course make sure to change 'style.css' to your css file name.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.