时间戳

首页 > 解决方案 > Background image won't show via URL (HTML & CSS)

html - Background image won't show via URL (HTML & CSS)

问题描述

So I had been watching tutorials on how to code with html, and I succeeded at first with the whole background-image: url('somePicture.jpg'); but my issue now is that it doesn't show up at all. I've been learning all week last week but over the weekend I took a break and now I come back to my office and I ruined everything. Here's what I have now:

body{
    font-family: 'Syne', serif;
}
#help{
    color: purple;
}
.what{
    font-weight: bold;
}
section{
    border: solid 5px purple;
    padding: 20px 5px 10px 5px;
    margin: 0px auto 0px auto;
    width: 500px;
}
main{
    background-image: rgb(59, 59, 187) url("https://photographylife.com/wp-content/uploads/2017/05/img013-1200-copy.jpg") center/contain no-repeat;
}
<!DOCTYPE html>
<html>
    <head>
        <link href="https://fonts.googleapis.com/css2?family=Syne&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="Christ.css">
<title>
    Wow
</title>
    </head>
    <body>
        <main>
            <section>
                <h1 id="help">Oh.</h1>
                <p class="what">Hello, I exist. This is text. Welcome.</p>
            </section>
        </main>
    </body>
</html>

标签： htmlcssimageurlbackground

解决方案

I think the property you've gotten confused between the background property and background-image property. I just changed the CSS code to use background instead of background-image and it works expectedly.

推荐阅读