Question

In: Computer Science

Hello! Html question. I am trying to add a background to a page. How would i...

Hello! Html question. I am trying to add a background to a page. How would i do this? I have tried using a jpg. The code is posted below. i used the background-image: url function. Any help of different ways to do this would be appreciated! Thank you!

CODE:

<!DOCTYPE html>

<html>

<head>

<style>

ul {

list-style-type: none;

margin: 0;

padding: 0;

overflow: hidden;

background-color: #333;

}

li {

float: left;

}

li a {

display: block;

color: white;

text-align: center;

padding: 14px 16px;

text-decoration: none;

font-family: fantasy;

font-size: 20px;

}

li a:hover {

background-color: #111;

}

body {

font-family: Arial, Helvetica, sans-serif;

background-image: url("Dark Brown Volcanic Sand Background Stock Photo, Picture And Royalty Free Image. Image 124599840..html");

}

p {

font-family: comic sans ms;

font-size: 21px;

color: red;

}

footer {

clear: both;

position: relative;

z-index: 10;

height: 32px;

margin-top: -3em;

background: #333;

text-align: center;

font-size: 20px;

color: white;

}

div.gallery {

margin: 10px;

border: 1px solid #ccc;

float: left;

width: 300px;

}

div.gallery:hover {

border: 1px solid #777;

}

div.gallery img {

float: left;

width: 100%;

height: 200px;

object-fit: cover;

}

div.desc {

padding: 40px;

text-align: center;

}

</style>

<title>Frank and Carol's Comfy Candles</title>

</head>

<body>

<ul>

<li><a href="home.html">Home</a></li>

<li><a href="about.html">About</a></li>

<li><a href="product.html">Products</a></li>

</ul>

<div class="gallery">

<img src="01-christmas-wreath.jpg" alt="Christmas Wreath Candle">

</a>

<div class="desc">

Our Christmas wreath candle is our #1 best seller! Hand-crafted for the holidays, it always a centerpiece in

any christmas display, right at home next to the tree and a warm fire with egg nog. It brings a pine-y,

Yuletide joy to any room, and burns for hours during the long winter nights. Bring our wreath candle into

your home today, and make your holidays complete!

<br>Price: $24.95</div>

</div>

<div class="gallery">

<img src="02-chocolate-orange.jpg" alt="Chocolate Orange Candle">

</a>

<div class="desc">Our luxurious chocolate orange candle is an excellent way to wind down after a stressful day.

The strong flavors intertwine slowly while the candle burns, leaving your sense of smell hungry for more the

longer it is lit! It's always a lovely surprise for that special someone in your life, melting away the

worries into velvety bliss.

<br>Price: $16.95</div>

</div>

<div class="gallery">

<img src="03-aromatherapy.jpg" alt="Aromatherapy Candle">

</a>

<div class="desc">Allow the restorative power of our lavender aromatherapy candle to create a safe space in your

home. It is the perfect scent for meditation and deep contemplation, a deeply calming sensual experience for

your hectic lifestyle. Let the healing begin!

<br>Price: $12.95</div>

</div>

<div class="gallery">

<img src="04-cactus-candle.jpg" alt="Cactus Candle">

</a>

<div class="desc">Our fun and quirky cactus candle makes a great gift for that special someone in your life who

is undergoing transformative change, and needs a serene reminder of looking for the unexpected. It makes an

excellent party favor and conversation starter, and even as a decorative piece can bring a lot of joy to

your home!

<br>Price: $8.95</div>

</div>

<div class="gallery">

<img src="05-independence-day-3pk.jpg" alt="Independence Day Candle">

</a>

<div class="desc">One of our best sellers, this candle set evokes the wild and free nights of summer.

Exhilarating smells of campfires, fireworks, and freedom will liven up your next summer BBQ or picnic.

Equally enjoyable all year round!

<br>Price: $24.95</div>

</div>

<div class="gallery">

<img src="06-big-red.jpeg" alt="Big Red">

</a>

<div class="desc">Everyone loves Big Red! Deep hints of cinnamon and spice go nice all year round for this

long-burning candle. Fill your house with the smells of fresh baked apple pie and churro mixed together,

bringing even the most foggy-headed back to reality with this delicious cent. An absolute value!

<br>Price: $13.95</div>

</div>

<footer>2020 &copy; Frank and Carol's Comfy Candles, built with love by </footer>

</body>

</html>

Solutions

Expert Solution

NOTE :

  • Background-image property can accepts image as background
  • no any other type of files are allowe as a background like .html etc

******************************************************

Below is the modified code :

<!DOCTYPE html>

<html>

<head>

    <style>

        ul {

            list-style-type: none;

            margin: 0;

            padding: 0;

            overflow: hidden;

            background-color: #333;

        }

        li {

            float: left;

        }

        li a {

            display: block;

            color: white;

            text-align: center;

            padding: 14px 16px;

            text-decoration: none;

            font-family: fantasy;

            font-size: 20px;

        }

        li a:hover {

            background-color: #111;

        }

        body {

            font-family: Arial, Helvetica, sans-serif;

            background-image: url("images/1060201.jpg");

            background-repeat: no-repeat;

            background-size: 100%;

        }

        p {

            font-family: comic sans ms;

            font-size: 21px;

            color: red;

        }

        footer {

            clear: both;

            position: relative;

            z-index: 10;

            height: 32px;

            margin-top: -3em;

            background: #333;

            text-align: center;

            font-size: 20px;

            color: white;

        }

        div.gallery {

            margin: 10px;

            border: 1px solid #ccc;

            float: left;

            width: 300px;

        }

        div.gallery:hover {

            border: 1px solid #777;

        }

        div.gallery img {

            float: left;

            width: 100%;

            height: 200px;

            object-fit: cover;

        }

        div.desc {

            padding: 40px;

            text-align: center;

        }

    </style>

    <title>Frank and Carol's Comfy Candles</title>

</head>

<body>

    <ul>

        <li><a href="home.html">Home</a></li>

        <li><a href="about.html">About</a></li>

        <li><a href="product.html">Products</a></li>

    </ul>

    <div class="gallery">

        <img src="01-christmas-wreath.jpg" >

        </a>

        <div class="desc">

            Our Christmas wreath candle is our #1 best seller! Hand-crafted for the holidays, it always a centerpiece in

            any christmas display, right at home next to the tree and a warm fire with egg nog. It brings a pine-y,

            Yuletide joy to any room, and burns for hours during the long winter nights. Bring our wreath candle into

            your home today, and make your holidays complete!

            <br>Price: $24.95</div>

    </div>

    <div class="gallery">

        <img src="02-chocolate-orange.jpg" >

        </a>

        <div class="desc">Our luxurious chocolate orange candle is an excellent way to wind down after a stressful day.

            The strong flavors intertwine slowly while the candle burns, leaving your sense of smell hungry for more the

            longer it is lit! It's always a lovely surprise for that special someone in your life, melting away the

            worries into velvety bliss.

            <br>Price: $16.95</div>

    </div>

    <div class="gallery">

        <img src="03-aromatherapy.jpg" >

        </a>

        <div class="desc">Allow the restorative power of our lavender aromatherapy candle to create a safe space in your

            home. It is the perfect scent for meditation and deep contemplation, a deeply calming sensual experience for

            your hectic lifestyle. Let the healing begin!

            <br>Price: $12.95</div>

    </div>

    <div class="gallery">

        <img src="04-cactus-candle.jpg" >

        </a>

        <div class="desc">Our fun and quirky cactus candle makes a great gift for that special someone in your life who

            is undergoing transformative change, and needs a serene reminder of looking for the unexpected. It makes an

            excellent party favor and conversation starter, and even as a decorative piece can bring a lot of joy to

            your home!

            <br>Price: $8.95</div>

    </div>

    <div class="gallery">

        <img src="05-independence-day-3pk.jpg" >

        </a>

        <div class="desc">One of our best sellers, this candle set evokes the wild and free nights of summer.

            Exhilarating smells of campfires, fireworks, and freedom will liven up your next summer BBQ or picnic.

            Equally enjoyable all year round!

            <br>Price: $24.95</div>

    </div>

    <div class="gallery">

        <img src="06-big-red.jpeg" >

        </a>

        <div class="desc">Everyone loves Big Red! Deep hints of cinnamon and spice go nice all year round for this

            long-burning candle. Fill your house with the smells of fresh baked apple pie and churro mixed together,

            bringing even the most foggy-headed back to reality with this delicious cent. An absolute value!

            <br>Price: $13.95</div>

    </div>

    <footer>2020 &copy; Frank and Carol's Comfy Candles, built with love by </footer>

</body>

</html>

=================================================


Related Solutions

Hello, I have been trying to answer this question for the last hour and I am...
Hello, I have been trying to answer this question for the last hour and I am still struggling could someone help me? The deadline is in 1hour! Perform an analysis of variance on the following data set. Do this by answering the questions below. Group 1 Group 2 Group 3 82 87 97 91 90 99 93 91 104 94 99 105 94 101 106 95 115 109 99 118 110 101 114 103 117 105 121 106 121 106...
I am trying to sell this to potential individual and business sponsors. What would you add...
I am trying to sell this to potential individual and business sponsors. What would you add to this proposal to truly get the message out that this donation will change the way our students learn with this walking classroom and beautification project? Individual and/or business logo placement? Stronger description of product? Details missing? Grammar issues? Formatting? Or anything else you may think is needed for me to make this something truly special.   
Hello, I am working on an assignment but I am unsure of how to solve it....
Hello, I am working on an assignment but I am unsure of how to solve it. Please help me. The assignment details are below. Consider this scenario: Your friend starts a website, nothingbutflags.com, which is not making money. Your friend asks you to help generate more traffic. You ask your friend how much traffic the website had last month? And your friend replies and says only 500 visits. You also ask how many flags did you sell? Your friend replies...
Hello, I am working on an assignment but I am unsure of how to solve it....
Hello, I am working on an assignment but I am unsure of how to solve it. Please help me. The assignment details are below. Consider this scenario: Your friend starts a website, nothingbutflags.com, which is not making money. Your friend asks you to help generate more traffic. You ask your friend how much traffic the website had last month? And your friend replies and says only 500 visits. You also ask how many flags did you sell? Your friend replies...
Hello, I am trying to write a C++ program that will do the following: Use the...
Hello, I am trying to write a C++ program that will do the following: Use the STL stack container in a program that reads a string, an arithmetic expression to be exact, one character at a time, and determines if the string has balanced parenthesis – that is, for each left parenthesis there is exactly one matching right parenthesis later in the string.                         Use the following strings to test your program. A+ B - C A * B / (C...
Hello: Can someone explain the below? I am trying to understand the below. How does net...
Hello: Can someone explain the below? I am trying to understand the below. How does net income and assets vary for each of the below? 1) furniture company sold an unused piece of land next door to their manufacturing facilities. land was purchased for $2M years back and sold for $4M. buyer paid in cash. 2) goodwill was over valued by $25M. Company recorded the entry to adjust goodwill to current value 3) company repurchased $5M of common stock and...
Hello I am trying to come up with some answer for a Data mining project. And...
Hello I am trying to come up with some answer for a Data mining project. And need some better detailed answers for the following. 1. What is the issue with the usual linear regression? 2. What does lasso regression do? 3. What's the general theory about lasso? such as the formulas and the general properties of lambda? please kindly give a little explanation for each. Thankyou. (:
I am trying to get this code to work but I am having difficulties, would like...
I am trying to get this code to work but I am having difficulties, would like to see if some one can solve it. I tried to start it but im not sure what im doing wrong. please explain if possible package edu.hfcc; /* * Create Java application that will create Fruit class and Bread class * * Fruit class will have 3 data fields name and quantity which you can change. * The third data field price should always...
hello, I am having an issue with a question in my highway engineering course. the question...
hello, I am having an issue with a question in my highway engineering course. the question is: An equal tangent sag vertical curve has an initial grade of –2.5%. It is known that the final grade is positive and that the low point is at elevation 82 m and station 1 + 410.000. The PVT of the curve is at elevation 83.5 m and the design speed of the curve is 60 km/h. Determine the station and elevation of the...
Assembly Question: I am trying to annotate this code and am struggling to understand what it...
Assembly Question: I am trying to annotate this code and am struggling to understand what it is doing. Can someone please add comments? .data .star: .string "*" .line: .string "\n" .input: .string "%d" .count: .space 8 .text .global main printstars: push %rsi push %rdi _printstars: push %rdi mov $.star, %rdi xor %rax, %rax call printf pop %rdi dec %rdi cmp $0, %rdi jg _printstars mov $.line, %rdi xor %rax, %rax call printf pop %rdi pop %rsi ret printstarpyramid: mov %rdi,...
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT